Angular 2，生成结果表时，当父组件进行休息呼叫时

Question

我想

• 在我的父组件（ getTest（））
中运行休息查询
• 运行上述查询后，我希望它填充结果：test [] 带有结果
• 一旦结果：test [] 已经填充了我希望将其传给儿童类，以便可以使用它来生成HTML表，以便表的行表示表结果。

我的问题是 ngonchanges（）在子类中的方法永远不会被调用，所以我不确定在父母可用时如何从父母那里获得结果。

这是我的父母和子组件.ts文件

export class BlotterComponent implements OnInit, OnChanges {
showAdvancedForm: boolean;
results: test[];
constructor(private blotterPostService: BlotterPostService) {
    this.showAdvancedForm = false;
}
ngOnInit() {}
ngOnChanges(changes: any) {
    console.log("ngOnChanges BlotterComponent");
    console.log(this.results);
}
getTest() {
    console.log("Running test RESTful query..");
    this.blotterTradesPostService.getTestQuery().subscribe(u => {
        this.results = u;
        console.log(this.results);
    });
    }
}

这是我的孩子组件.ts文件。

export class TestTableComponent implements OnInit, OnChanges {
  @Input() testResults: test[];
  constructor() { }
  ngOnInit() {}
  ngOnChanges() {
      console.log("ngOnChanges TestTableComponent search results");
      console.log(this.testResults);
  }

}

Answer 1

您可以创建一个服务并使用事件发射器来散发更改并订阅儿童组件中的这些更改，您必须

1： - 创建服务

import { Injectable, Inject,EventEmitter } from '@angular/core';
@Injectable()
export class EmitterService {
public testEmitter:EventEmitter<test[]>=new EventEmitter(); 
}

2.在您的根部组件注射服务depandany in countructor中并发射结果后

  constructor(private emitter :EmitterService) //inject service
 this.blotterTradesPostService.getTestQuery().subscribe(u => {
    this.emitter.testEmitter.emit(u);
    console.log(this.results);
});

3.在您的孩子组件构造函数

  constructor(private emitter :EmitterService){
    this.emitter.testEmitter.subscribe(results =>{
    //here you can write your code it will be called every time emit method is called
  })
 }

有关更多信息，您可以查看此plunker