angular2の別のコンポーネントtplからコンポーネントに文字列を渡す

Question

コンポーネントテンプレートからプレーンストリングを別のコンポーネントに渡すことはできますか？例えば...

コンポーネント1つのTPL：

<survey-step-complete-msg [messageType]="'completed-survey'"></survey-step-complete-msg> 

コンポーネント2 .TS

import {Component, Input} from '@angular/core'; 
@Component({ 
    selector: 'survey-step-complete-msg', 
    templateUrl: '../../../../public/template/topic/survey-step-complete-msg.html' 
}) 
export class SurveyStepCompleteMsgComponent { 
    @Input() messageType; 
    constructor(){ 
     console.log(this.messageType); 
    } 
} 

コンポーネント2 TPL：

<div [ngSwitch]="messageType"> 

    <p *ngSwitchCase="completed-survey">Thanks</p> 
    <p *ngSwitchCase="survey-step-required-fields-missing">Stuff missing</p> 
    <p *ngSwitchCase="survey-required-fields-missing">Stuff missing</p> 
    <p *ngSwitchCase="survey-thanks-now-save">Thanks, don't forget to save.</p> 

</div> 

現在の結果は、TS要素であります@入力は常に定義されていません。

Answer 1

コンストラクタではまだ定義されていないため、未定義です。このconsole.logをngOnInit（）メソッドに入れてください。それはそこに見えるはずです。

もマークアップは次のとおりです。

*ngSwitchCase="expression" 

完成-調査では表現できません。試してみてください：

<p *ngSwitchCase="'completed-survey'">Thanks</p> 

Answer 2

スイッチケースのステートメントも引用符で囲みます。

<p *ngSwitchCase="'completed-survey'">Thanks</p> 

Answer 3

早くこの問題が発生しました。あなたはする必要があります：[messageType] = "'completed-survey'の代わりにmessageType =" completed-survey ""