選擇的選項沒有顯示Angularjs下拉列表

當我使用的對象具有selectedOptions屬性時，它不會顯示在下拉列表中。但是，當我放入範圍並從對象中選擇時，就會顯示它。任何人都知道爲什麼第一個不工作。這是plunker鏈接。選擇的選項沒有顯示Angularjs下拉列表

http://plnkr.co/edit/XLuXmAmh4F9OobyJhBCW?p=preview

var app = angular.module('angularjs-starter', []); 


var model = { 
    options : [ 
    { id: 1, name: 'foo' }, 
    { id: 2, name: 'bar' }, 
    { id: 3, name: 'blah' }], 
    selectedOption : { id: 1, name: 'foo' } 
} 

app.value('vm',model); 

app.controller('MainCtrl', function($scope,vm) { 
    $scope.vm =vm; 

    $scope.items = [ 
    { id: 1, name: 'foo' }, 
    { id: 2, name: 'bar' }, 
    { id: 3, name: 'blah' }]; 

    $scope.selectedItem = $scope.items[1]; 
}); 

<body ng-controller="MainCtrl"> 
    <h1>Select something below</h1> 
    <select id="s1" ng-model="selectedItem" ng-options="item as item.name for item in items"></select> 
    <h3>The selected item:</h3> 
    <pre>{{selectedItem | json}}</pre> 
    <h3>The inner html of the select:</h3> 
    <pre id="options" class="prettify html"></pre> 


     <select data-ng-options="o.name for o in vm.options" data-ng-model="vm.selectedOption"><option value="">Select one</option></select> 
     <pre>{{vm.selectedOption | json}}</pre> 


    </body>

來源

2015-06-27 Rupesh Kumar Tiwari

如何使這工作，我做了這個工作通過使用selectedoption作爲ID。 plnkr.co/edit/XLuXmAmh4F9OobyJhBCW?p=preview但是每當我想顯示所選的選項名稱時，我都會調用一個函數來顯示它。但我不喜歡這種方法。 –

角使用嚴格比較（===），以評估是否給定的選項是被選擇。它只會在selectedItem的值爲與相同的情況下作爲選項的值。而在JavaScript中，如果你創建相同結構的兩個物體，儘量嚴格比較的話，他們是不一樣的，即：

{a: 1} !== {a: 1}

在你保持參照原始對象第二個例子insted的，所以它會這樣做：

var obj1 = {a: 1}; 
var obj2 = obj1; 
obj1 === obj2;

來源

2015-06-27 23:51:05

因此，每當我想要選擇的選項名稱，那麼我是否有調用函數來過濾和顯示？就像我在這裏http://plnkr.co/edit/XLuXmAmh4F9OobyJhBCW?p=preview –

選擇的選項沒有顯示Angularjs下拉列表

回答

相關問題