Setzen Sie den Standardwert innerhalb ngSelect

Question

Ich habe eine a ngSelect mit einigen Optionen drin.

<select data-ng-model="type" data-ng-change="option(type)"> 
    <option data-ng-repeat="type in languages" value="{{type.i18n}}"> 
     {{type.language}} 
    </option> 
</select> 

und ein Controller

angular.module('navigation', []) 
.controller('NavCtrl',['$scope','$translate', function($scope,$translate){ 

    $scope.option = function(type){ 
     console.log(type) //this display the i18n value of languages 
     $translate.use(type); 
    } 

    $scope.languages = [ 
     { language: "English", i18n: "en_EN"}, 
     { language: "Swedish", i18n : "se_SE" } 
    ]; 
}]) 

ich die ngSelect will eine Standardoption haben, in meinem Fall: "English". Ich habe versucht, es zu setzen:

$scope.type = $scope.languages[0].language; // English 
$scope.type = $scope.languages[0]; //The whole darn json object. 

Hilfe bitte?

Answer 1

Versuchen Sie, diese Art und Weise

<select ng-model="selectedlanguage" ng-change="option(this.selectedlanguage)" ng-options="i.language for i in languages"> 
      </select> 

// Js Code

angular.module('navigation', []) 
.controller('NavCtrl',['$scope','$translate', function($scope,$translate){ 

    $scope.option = function(type){ 
     console.log(type) //this display the i18n value of languages 
     $translate.use(type); 
    } 

    $scope.languages = [ 
     { language: "English", i18n: "en_EN"}, 
     { language: "Swedish", i18n : "se_SE" } 
    ]; 

    **$scope.selectedlanguage = $scope.languages[0];** 
}]) 

Answer 2

Wie wäre es mit ngSelected? http://docs.angularjs.org/api/ng/directive/ngSelected

<option ng-selected="$index==0"></option> 

oder

<option ng-selected="type.language=='English'"></option> 

Answer 3

Arbeitsbeispiel: http://plnkr.co/edit/yv8gew3IDGxjH666UmlC?p=preview

<select data-ng-model="selectedType"> 
    <option data-ng-repeat="lang in languages" value="{{lang.i18n}}"> 
    {{lang.language}} 
    </option> 
</select> 

JS:

.controller('NavCtrl',['$scope', function($scope){ 

    $scope.$watch('selectedType', function(type){ 
     if (!type) return; 
     console.log(type) //this display the i18n value of languages 
     // $translate.use(type); 
    }); 

    $scope.languages = [ 
     { language: "English", i18n: "en_EN"}, 
     { language: "Swedish", i18n : "se_SE" } 
    ]; 

    $scope.selectedType = $scope.languages[0].i18n; 
}]); 

Hinweise:

• entfernt Haben die $translate Service für eine einfache Reproduktion.
• Haben einen ng-changed Rückruf auf eine $watch auf der $scope geändert, aber das ist nur eine ästhetische Wahl.
• Die entscheidende Veränderung war, dass Sie die lang.i18n für type aussuchten aber type zu lang.language wurden gelegt werden, was in keine Einträge in der Liste s option führt.

Answer 4

Ich habe nicht genug Ruf zu kommentieren, also werde ich es als Antwort verlassen.

Die Ramesh Rajendran Antwort ist richtig, aber Sie haben versucht, eine andere ngOptions Syntax verwenden. Wenn Sie die Syntax label for value in array verwenden, müssen Sie das Modellattribut an das gesamte Objekt binden. Wenn Sie die Syntax in Ihrem Kommentar verwenden, der select as label for value in array ist, dann müssen Sie das Modell an die Auswahl binden.

Mit anderen Worten, seinem Beispiel arbeitet, und auf den Kommentar zu Ihrem Beispiel arbeiten Sie $scope.selectedlanguage = $scope.languages[0]; mit $scope.selectedlanguage = $scope.languages[0].i18n;

Überprüfen Sie die select directive documentation für weitere Informationen

Answer 5

Dieser arbeitete für mich ersetzen müssen:

$scope.prop = { "values": 
[ {name:'hello1',id:1},{name:'hello2',id:2},{name:'hello3',id:3}] }; 
$scope.selectedValue = 2; 

<select ng-model="selectedValue" ng-options="v.id as v.name for v in prop.values"> 
    <option selected value="">Select option</option> 
</select> 

anschauliches Beispiel: Plunker