Standardoption zu angularjs hinzufügen select

Question

Ich versuche eine Standardoption zu einer Auswahl mit eckigen hinzuzufügen, aber es fügt eine leere Option hinzu, die merkwürdig verschwindet, wenn ich sie auswähle.

Ich bekomme das Objekt zu binden an die Auswahl mit ng-options wie folgt. Ich bin eine Standardoption wie folgt angehängt:

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)); 

Die Struktur der Objekte ist:

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

ich ng-options dann verwenden, um die Objekte zu binden:

<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> 

Dann ärgerlich ist dies dass eine leere Option hinzugefügt wird, die entfernt wird, wenn ich ein Element auswähle.

Die Optionen sind auch nicht bestellt, so dass ich vermute, dass mein Listenverständnis falsch ist.

Answer 1

Sie einen Standardwert auf diese Weise hinzufügen:

<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> 

bearbeiten Oder init-Funktion

<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

ein Standard <select> Elemente zuordnen definieren mit nur ng-model binded Variable einen Standardwert verfügbar in einem <option> Element (oder Wert).

In Ihrem Fall vm.selectedDocumentType sollte, wird

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

zu einem vm.documentTypes[theIndexYouChoose].DocumentTypeID

Mehr im Allgemeinen ein vereinfachtes Beispiel eingestellt werden

sein könnten Sie keine leeren Optionen finden und die gewählte Option 1