1
を使用するように設定ラジオボタンオプションにどのようにユーザがラジオボタンから値を選択Proposal
成分を有する:各場合においてAngular2 - 動的な値
public salutations = [
{ value: 0, display: 'Mr & Mrs' },
{ value: 1, display: 'Mrs' },
{ value: 2, display: 'Ms'},
{ value: 3, display: 'Mr'},
{ value: 4, display: 'proposal.first_name'}
];
を、選択されたオプションをに格納されます。 Proposal.greeting
フィールド。私は値を格納していませんが、実際の表示プロパティです。あなたが見ることができるように
<div *ngFor="let salutation of salutations">
<label>
<input type="radio" name="salutation" [(ngModel)]="proposal.salutation"
[value]="salutation.display"> <!-- we DO NOT want to store the integer value -->
{{salutation.display}}
</label>
</div>
ユーザがオプション4を選択したときに、その意図は、提案者(proposal.first_name)の実際の名前を格納することです。
後、私はこのようになりますビュー持っているので、これがある:選択したとき、それはfirst_nameのではなく、文字列「proposal.first_nameを格納するように、どのように私は(そのオプション4動的に行うことができます
<p>Dear {{proposal.greeting}} {{proposal.last_name}},</p>
を')。
ありがとう、素晴らしい答えと私はpunkrの作品を見ることができます。問題は、これは新しいプロポーザルが作成されているときに使用されるため、 'this.proposal.first_name'はnull値を持つため、オプション4の画面では何も表示できません。 – rmcsharry
私が考えることができる唯一の解決策は、ラジオボタンをfirst_nameを入力とし、どのオプションが選択されたかを出力する子コンポーネントにします。このような単純な問題のために多くの作業があるようです! – rmcsharry