Angular2：交換子

Question

我試圖交換使用ngIf像子：

<div *ngIf="paymentListShow" payment-list></div> 
<div *ngIf="paymentFormShow" payment-form></div> 

所以，我的父組件旨在處理這些值：

swapComponent(componentName: string): void { 
    let paymentState = { 
     'paymentList': (that): void => { 
     that.paymentFormShow = false; 
     that.paymentListShow = true; 
     }, 

     'paymentForm': (that): void => { 
     that.paymentListShow = false; 
     that.paymentFormShow = true; 
     } 
    }; 

    paymentState[componentName](this); 
} 

它存在不存在任何更優雅交換子組件的方法？使用rxjs Observables？

任何想法？

Answer 1

當然不是最好的，但是這可能是一個更清潔的方式：

show = { 
    paymentList: true, 
    paymentForm: false 
} 

swapComponent(componentName: string): void { 
    for (const component in this.show) { 
    if (this.show.hasOwnProperty(component)) { 
     this.show[component] = (component === componentName) ? true : false; 
    } 
    } 
} 

與合併：

<div *ngIf="show.paymentList" payment-list></div> 
<div *ngIf="show.paymentForm" payment-form></div>