你好,我是新手,有一点问题,这是我的代码:
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秒钟收集一次数据,并将这些数据存储到我的message变量中,该变量是Input(),因此应该每5秒钟触发一次ngOnChanges吗?我想念什么?
答案 0 :(得分:2)
@Input
属性应该是该组件的父级将传递的属性。不应从该组件内部的服务接收它。
如果是这种情况,则此服务调用应驻留在使用该组件的父组件中。
因此,如果您有一个组件(例如selector
:app-home
),则在app-home
的模板中,您将使用app-sensor-list
,并且从那里传递messages
。
与此类似:
<app-sensor-list [messages]="messages"></app-sensor-list>
再次在app-home组件的TypeScript类中,您将进行服务调用:
ngOnInit() {
setInterval(()=>{
this.messages=this.messageService.getMqttdata();
console.log("updating Sensors sources")
},5000);
}