相关疑难解决方法(0)

子组件初始化后,父组件对子 DOM 的操作会导致 ExpressionChangedAfterItHasBeenCheckedError

我想在子组件初始化后从父组件对子组件进行一些操作。

家长:

export class ParentComponent implements AfterViewInit {
  @ViewChild('child') childComponent: ChildComponent;

  ngAfterViewInit() {
    this.childComponent.domMethod('boo');
  }
}
Run Code Online (Sandbox Code Playgroud)
<p>parent</p>

<app-child #child></app-child>
Run Code Online (Sandbox Code Playgroud)

孩子:

<p>parent</p>

<app-child #child></app-child>
Run Code Online (Sandbox Code Playgroud)
<p>child</p>

<input type="text" id="childInput" [(ngModel)]="term">

<ul>
    <li *ngFor="let item of items | search: term">{{item.name}}</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

链接到StackBlitz以进行复制

编辑:

如果我添加setTimeout到父组件,它就可以工作。我可以在没有的情况下实现setTimeout吗?

export class ChildComponent implements OnInit {
  constructor(private readonly cdr: ChangeDetectorRef,) {

  }
  public term = '';
  public items;
  ngOnInit() {
    this.items = [
      { name: 'foo' },
      { name: 'bar' },
      { name: …
Run Code Online (Sandbox Code Playgroud)

angular angular-changedetection

0
推荐指数
1
解决办法
814
查看次数

标签 统计

angular ×1

angular-changedetection ×1