Question

我有一个父组件，并使用ViewChild来调用子组件中的方法。但是，当我加载数据并使用该方法传递数据时，它显示错误，我的方法未定义。我在哪里弄错了？

流量： 首先：在NgOnInit（）方法之后，我加载数据并将其传递给子组件第二次尝试：我使用NgAfterViewInit（）加载数据端，然后将其传递给子组件，但是它具有相同的错误

注意：父级具有一个可以多次创建子级组件的变量

附加description的示例代码：

Answer 1

您可以使用@Input装饰器将数据传递给孩子。理论：

通过此input
火灾变化检测以处理这些变化父级TS：

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
}

父HTML：

<app-child [name]="name"></app-child>

儿童TS：

import { Component } from '@angular/core';

@Component({
  selector: 'app-child',
  templateUrl: './app-child.component.html',
  styleUrls: [ './app-child.component.css' ]
})
export class AppChildComponent  {
  @Input() name = '';

  ngOnChanges(changes: SimpleChanges): void {
    if (changes.name) {
      this.setup();
    }
  }

  setup() {
     ...
  }
}

在孩子的内部设置中，您可以按预期处理数据。

将数据传递到可以多次调用的子组件

1 个答案: