anglejsにデフォルトオプションを追加します。

Question

デフォルトのオプションを角度付きの選択に追加しようとしていますが、それを選択すると、間違って消える空白のオプションが追加されます。

このようにng-optionsを使用して選択にバインドするオブジェクトを取得しています。私はこのようなデフォルトのオプションを追加しています：

var DocumentSearchController = function (documentsService) { 
    documentsService.getDocTypes().then(function (results) { 
     this.documentTypes = results.data; 
     this.documentTypes.unshift({ DocumentTypeID: null, Name: 'Select a Document Type' }); 
    }.bind(this)); 

オブジェクトの構造は次のとおりです。

[{DocumentTypeID: 1, Name: 'Blah'}] 

私は、オブジェクトをバインドするng-optionsを使用します。

<select class="form-control" 
     id="documentTypeSelector" 
     name="documentTypeSelector" 
     ng-model="vm.selectedDocumentType" 
     ng-options="option.Name for option in vm.documentTypes | orderBy: 'option.DocumentTypeID':false track by option.DocumentTypeID"> 
</select> 

次にいらいらこれは私が項目を選択したときに削除される空白のオプションが不思議に追加されていることを示します。

オプションも注文されていないので、私のリストの理解は間違っていると思われます。

Answer 1

あなたはこのようデフォルト値を追加することができます。

<select class="form-control" 
     id="documentTypeSelector" 
     name="documentTypeSelector" 
     ng-model="vm.selectedDocumentType" 
     ng-options="option.Name for option in vm.documentTypes | orderBy: 'option.DocumentTypeID':false track by option.DocumentTypeID"> 
    <option value="">Select a Document Type</option> 
</select> 

編集それともng-modelバインドさ変数に使用可能なデフォルト値を割り当てるデフォルト<select>要素を定義するにはinit関数に

<select class="form-control" 
     ng-init="vm.selectedDocumentType= vm.documentTypes[0]" 
     id="documentTypeSelector" 
     name="documentTypeSelector" 
     ng-model="vm.selectedDocumentType" 
     ng-options="option.Name for option in vm.documentTypes | orderBy:'option.DocumentTypeID':false track by option.DocumentTypeID"> 
</select> 

Answer 2

を使用して1つの<option>要素（または値）。あなたのケースでは

vm.selectedDocumentTypeは、簡略化した例より一般的には

// given $scope.options = [1, 2, 3]; 
<select ng-init="selectedOption=1" ng-option="option for option in options" ng-model='selectedOption'> 
</select> 

あなたは空のオプションを見つけることになり、選択されたオプションは、1

になります可能性があり vm.documentTypes[theIndexYouChoose].DocumentTypeID

に設定する必要があります