無法填充第二個選擇語句

我有2個select語句，第一個選擇由我的第一個webservice請求填充。用戶在第一個選擇中選擇所需的數據，其中將觸發onChange方法來檢索第一個選擇對象，再次運行webservice以檢索另一組數據並填充第二個select語句。無法填充第二個選擇語句

HTML：

<div class="input-label"> 
    Select Kittens: 
</div> 
<select 
ng-model ="options" 
ng-options ="option.name for option in options" 
ng-change="onChange(options)"> 
<option>--</option> 
</select> 
<br> 
<div class="input-label"> 
    Select Age: 
</div> 
<select 
ng-options ="detail.age for detail in details"> 
<option>--</option> 
</select>

控制器：

.controller("ctrl",['$scope',function($scope){ 
     $scope.options = [ 
      {id:1, name:'typeA'}, 
      {id:2, name:'typeB'}, 
      {id:3, name:'typeC'}, 
      {id:4, name:'typeD'} 
     ] 

      $scope.onChange = function(item){ 
      console.log("Hi world!"); 
      console.log(item); 
      $scope.details = [ 
      {id:1, age:'11'}, 
      {id:2, age:'10'}, 
      {id:3, age:'9'}, 
      {id:4, age:'6'} 
     ] 
    }; 
    }])

問題：

1）選擇所述第一選擇後，該值只是從選擇框消失，但該值（對象）成功傳遞到onChange函數

2）無法填充第二個選擇框

我創建了一個plunkr來複制我的問題（沒有web服務）。謝謝！

鏈接： http://plnkr.co/edit/tqI0a83PiIHNUkKLj1WF?p=preview

來源

2015-10-20 Gene

From Docs

選擇指令與ngModel一起使用，以提供的範圍和<select>控制（包括設置默認值）之間數據綁定。

另外，你需要改變第一個選擇ng-model爲ng-repeat是怎麼回事options和ng-model也是一樣的，即options，應將其更改爲someOpetion

標記

<select ng-model="someOpetion" ng-options="option.name for option in options" ng-change="onChange(options)"> 
    <option>--</option> 
    </select> 
    <br> 
    <div class="input-label"> 
    Select Age: 
    </div> 
    <select ng-options="detail.age for detail in details" ng-model="someDetails"> 
    <option>--</option> 
</select>

Plunker

來源

2015-10-20 05:58:36

使用此代碼：DEMO

<div class="input-label"> 
    Select Kittens: 
    </div> 
    <select ng-model="name" ng-options="option.name for option in options" ng-change="onChange(name)"> 
    <option>--</option> 
    </select> 

    <br> 

    <div class="input-label"> 
    Select Age: 
    </div> 
    <select ng-model ="age" ng-options="detail.age for detail in details"> 
    <option>--</option> 
    </select>

你的第一個ng-model = "options"的名稱，但內部控制器還使用$scope.options作爲對象的數組。

此外，在第二個<select>沒有ng-model。但是ng-options需要ng-model。

來源

2015-10-20 06:06:06

與我的相同：D –

我得到了你的問題。

這是你的plunker

Plunker

的固定版本，你需要在你的控制器使用這些作爲ng-model添加兩個scope變量。

您的第二選擇的問題是它沒有ng-model屬性。選擇必須具有ng-model屬性。

來源

2015-10-20 06:15:18

無法填充第二個選擇語句

回答

相關問題