在Angular 2中将布尔值从父级传递给子级组件

时间:2018-10-30 15:45:00

标签: angular

我正在尝试将布尔值从父级传递到子级组件,而不涉及模板文件。我知道使用模板文件进行正常的父母与孩子之间的交流,但我不知道如何在不使用模板类的情况下进行交流。

这是我尝试过的方法,但是我不确定这是否正确。

父component.ts:

export class ParentComponent{
value1: boolean;

ngOnInit(){
if(condition){
  this.value1=true;
}
}
}

子component.ts:

export class Childcomponent{
  @Input() value1: boolean;
}

1 个答案:

答案 0 :(得分:1)

将一个可观察对象添加到父组件。

 export class ParentComponent {
      public value$: Subject<boolean> = new Subject();

      public notifyChild(value: boolean) {
          this.value$.next(value);
      }
 }

将父级注入子级并订阅。

 export class ChildComponent implmenents OnDestroy {
     private destroyed: Subject = new Subject<void>;
     public constructor(parent: ParentComponent) {
         parent.value$.pipe(takeUntil(this.destroyed)).subscribe((value)=>{ ... });
     }
     public ngOnDestroy() {
          this.destroyed.next();
     }
 }