子コンポーネントで正しく更新されない

Question

コンポーネントとして使用するとリストが正しく更新されませんが、親に直接テンプレートを追加すると正常に動作します。いずれかの提案がありますか？

もし私がページを離れて戻ってきたら、それは正しく をロードします。そして、bankaccount-listコンポーネントのsubscribeにconsole.logを追加すると、新しい銀行口座を追加すると正しく更新されます。

これは親htmlです。

<div class="card-block card-list"> 
    <search-box (update)="term = $event"></search-box> 
    <bankaccounts-list (update)="setSelectedBankAccount($event)"></bankaccounts-list> 
<!--template from below component entered here works, but when done like this it doesnt--> 
    </div> 

これは親

@Component({ 
    selector: 'bankaccounts-list', 
    moduleId: module.id, 
    directives: [NgClass], 
    template: ` 
    <div class="list-group scroll-list"> 
    <div class="card" *ngFor="let bankAccount of bankAccounts> 
     <div class="card-header"> 
     {{bankAccount.name}} 
     </div> 
     <div class="card-block"> 
     {{bankAccount.description}}<br /> 
     </div> 
    </div> 
    </div> 
    ` 
}) 
export class BankAccountListComponent implements OnInit { 
    @Output() update = new EventEmitter(); 
    bankAccounts: any = []; 
    constructor(public userDetailsService: UserDetailsService) { 
    } 
    ngOnInit() { 
     this.userDetailsService.bankAccounts 
     .subscribe((data:any) => { 
     this.bankAccounts = data; 
    });} 
} 

詳細に追加されたコンポーネントです： 私はモーダルにロードされている第三成分を使用して新しいアカウントを追加します。 それは私が購読にmarkForCheckを追加し、前hapeningたとして、それは今フルcomponantツリーを通じてだけではなく、親に取り組んでいますuserDetailsService

private _bankAccounts: BehaviorSubject<any[]> = new BehaviorSubject(<any>[]); 
bankAccounts = this._bankAccounts.asObservable(); 

---

newBankAccount(acnt: any) { 
    let bank = this._bankAccounts.getValue(); 
    bank.push({ 
     'id': Math.floor((Math.random() * 50) + 1), 
     'name':acnt.name, 
     'description':acnt.desc, 
     'bankAccountName':acnt.acnt_name, 
     'bankAccountBsb':acnt.bsb, 
     'bankAccountNumber':acnt.num 
    }); 
    this._bankAccounts.next(bank); 
    } 

Answer 1

export class BankAccountListComponent implements OnInit { 
    @Output() update = new EventEmitter(); 
    bankAccounts: any = []; 
    constructor(private cd: ChangeDetectorRef, 
    public userDetailsService: UserDetailsService) { 
    } 
    ngOnInit() { 
     this.userDetailsService.bankAccounts 
     .subscribe((data:any) => { 
     this.bankAccounts = data; 
     this.cd.markForCheck(); 
    });} 
} 

上の関数を呼び出します。