ngOnChanges 未被触发

Question

你好，我是 angular 的新手，遇到了一些小问题，这是我的代码：

import { Component, OnInit,Input, SimpleChange, OnChanges } from '@angular/core';
import { Sensor } from '../../shared/sensor.model';
import { MessageService } from '../../shared/message.service';

@Component({
  selector: 'app-sensor-list',
  templateUrl: './sensor-list.component.html',
  styleUrls: ['./sensor-list.component.css']
})
export class SensorListComponent implements OnInit {

  sensors:Sensor[]=[];
  sensorsId : number[]=[];
  @Input() messages:JSON[]=[];
  constructor(private messageService: MessageService) { }

  ngOnInit() {
    setInterval(()=>{
      this.messages=this.messageService.getMqttdata();
      console.log("updating Sensors sources")
    },5000);
  }

  ngOnChanges(changes SimpleChange }) {
      console.log("sources has been modified")
  }

在 ngOnInit 中，我每 5 秒收集一次数据并将这些数据存储到我的消息变量中，这是一个 Input() 所以它应该每 5 秒触发一次 ngOnChanges 吗？我错过了什么？

Answer 1

@Input 属性应该是该组件的父级将传递给它的东西。不应从该组件内部的服务接收它。

如果是这样的话，这个服务调用应该驻留在使用这个组件的父组件中。

所以如果你有一个组件（比如 selector: app-home），那么在 app-home 的模板中，你将使用 app-sensor-list 并且你将从那里通过 messages。

大致如下：

<app-sensor-list [messages]="messages"></app-sensor-list>

再次在 app-home 组件的 TypeScript class 中，您将进行服务调用：

ngOnInit() {
    setInterval(()=>{
      this.messages=this.messageService.getMqttdata();
      console.log("updating Sensors sources")
    },5000);
}

ngOnChanges 未被触发

ngOnChanges is not triggered

typescript

ngonchanges

angular