一方向の結合angle2を使用して入力フィールドに値が表示されない

Question

目的：ドロップダウン選択に基づいて値のコレクションを取得し、非表示の入力フィールドに配置してモデルに組み込みます。

相対HTML：I上記のコードで

<select class="selectFoo" (change)="onSelect($event.target.value)" name="FooName" ngModel> 
 
      <option selected="selected">--Select--</option> 
 
      <option *ngFor="let foo of foos" [value]="foo.ID">{{foo.Name}} 
 
</option> 
 
</select> 
 
<input type="hidden" [value]="fooAddress" name="FooAddress" ngModel/>

は、選択したFOOに関するデータを取得するためにONSELECTという名前の関数を呼び出しました。 foosはwebserviceコールを使用して設定されます。ここに私のTSファイルのスニペットがあります。

import { Component, OnInit } from '@angular/core'; 
 

 
import { Foo } from './model'; 
 

 
import { DataService } from './data.service'; 
 

 

 
@Component({ 
 
    moduleId: module.id, 
 
    selector: 'add-on', 
 
    templateUrl: './app.component.html' 
 
}) 
 
export class AppComponent implements OnInit { 
 
    foos : Foo[]; 
 

 
    selectedFoo: Foo; 
 
    fooAddress: string; 
 

 
    onSelect(fooID){ 
 
     this.selectedFoo = null; 
 
     for(var i = 0; i < this.foos.length; i++) 
 
     { 
 
     console.log(this.foos[i].ID); 
 
     if(this.foos[i].ID == fooID){ 
 
      this.selectedFoo = this.foos[i]; 
 
      this.fooAddress = this.selectedFoo.Address.toString(); 
 
     } 
 
     } 
 
    } 
 
    }

私はもともとselectedFooに自分の価値を結合一つの方法を試してみましたが、私は定義されていなかった私のアドレス値を示すエラーを得ていました。私はselectedFooと等しい値を設定することができ、それはエラーではないことに気づいた。そこで私は、選択されたfooに基づいてfooAddressに設定された新しい変数を作成しました。私はそれが価値を持って参照してくださいコードをステップ実行中にも私は価値がない。

モデルに使用できるように値を設定するにはどうすればよいですか？他に何かを提供する必要があるかどうかを教えてください。

ありがとうございます！

Answer 1

私が正しくあなたがして後にこのような何かがうまくいく何であるかを理解していた場合：ここで

<select name="FooName" [(ngModel)]="selectedFoo"> 
    <option>--Select--</option> 
    <option *ngFor="let foo of foos" [ngValue]="foo" >{{foo.Name}}</option> 
</select> 
<input type="hidden" [value]="selectedFoo?.Address" name="FooAddress" /> 

//Assuming your 'foo' items are e.g. { ID: 1, Name: 'Hello', Address: '123 Hello St'} 

あなたではなく処理するために必要とするよりも、あなたの隠された入力フィールドに直接selectedFooのAddressプロパティをバインドすることができます(change)イベント。