角2 - デフォルトがハードコードされている場合のドロップダウンのデフォルト値の設定

Question

次のドロップダウンがあります。私はすべての患者をデフォルト値に設定したいと思います。

<select [(ngModel)]="searchModel.careprovider"> 
     <option [value]="0">All Pateints</option> 
     <option *ngFor="let user of practiceUsers" [value]="user._id.$oid"> 
     {{user.dn}} 
     </option> 
    </select> 

私のモデルは、このように宣言されています

searchModel: any = { location: null, practice: null, name: '', careProvider: 0 }; 

私はpracticeUsersをこのように設定します。

this._practice.getUsers(this.searchModel.practice).subscribe(result => { 
    this.practiceUsers = result; 
    this.searchModel.careProvider = 0; 
    }); 

どんなに私はそれをどのように変わるか、私はいつもと同じように空白のオプションを取得していませんデフォルト。私はそれがロードされた後にthis.practiceUsers配列にオブジェクトを追加しようとした後、モデル値を設定しようとしました。私は、数値や文字列が違いを生み出したかどうかを調べるために、引用符をつけたり、引用符を付けたりすることなくモデル値を設定しようとしました私が試してみると、デフォルトで空白のオプションになります。

角1では私はng-optionsを使用しましたが、これは角2では使用できなくなり、すべての例でドロップダウンにngForを使用することがわかります。

Answer 1

オブジェクトの属性は大文字と小文字が区別され、オブジェクトの属性はcareProviderとなりますが、テンプレートではの小文字のsearchModel.careproviderが使用されています。私はvalueの代わりにNgValueディレクティブを使用しなければならないと思います。NgModelディレクティブを使用しているからです。したがって、これはうまくいくはずです：

<select [(ngModel)]="searchModel.careProvider"> 
    <option [ngValue]="0">All Pateints</option> 
    <option *ngFor="let user of practiceUsers" [ngValue]="user._id.$oid"> 
    {{user.dn}} 
    </option> 
</select> 

Answer 2

[選択]属性を使用してみてください。私はこれは少し

Answer 3

<select class="form-control" id="policeid_country_id" name="policeid_country_id" formControlName="policeid_country_id"> 
    <option [ngValue]="null">Select</option> 
    <option [ngValue]="country.id" *ngFor="let country of countries">{{country.country}}</option> 
</select>