Question

我有CompA。 CompA有一个孩子CompB。 CompB具有ngIf条件，并且基于CompA和CompB之间共享的可观察量，它正在加载一些数据。当我将此条件设置为true时，我在CompA的observable上调用next但数据未显示CompB尚未初始化，因此它订阅了observable 这是代码：

//compA.html
<div>
...
<button (click)="switchToCompB()">Show</button>
<compB *ngIf="compBVisible"></compB>

</div>


//compA.ts
public switchToCompB() {
        this.compBVisible = !this.compBVisible;

        if (this.compBVisible)
            this.sharedObservable.next(message);
}

// compB.ts
ngOnInit(){
    this.sharedObservable.subscribe(message => {
        ...some code here
    })
}

我做错了什么？

Answer 1

您应该使用@Input事件绑定。

// compA.html
<button (click)="switchToCompB()">Show</button>
<compB *ngIf="compBVisible" [myInput] = "someInputValue"></compB>

//compB.ts

export class SomeClass{
 @Input myInput: any;
 ngOnInit(){
 // some code here to execute during component initialisation
 }

 ngOnChanges(change: SimpleChanges){

 //some code here to be executed whenever the input value changes
 }
}

Answer 2

我将Subject更改为BehaviorSubject。通过这种方式，一个价值总是存在于嫌疑人身上。因此，即使在条件设置后订阅CompB，它也始终获得最新值

未使用ngIf初始化子组件可观察对象

2 个答案: