AngularJS - 多项选择，设置默认值为动态选择

Question

使用AngularJS单独下拉每个产品的代码及其目录信息：

<ul style="height:250px;" >
<li data-ng-repeat="product in products" >
<div> {{SelectedOption.Price}} </div>
<select  data-ng-model="SelectedOption"  data-ng-init="SelectedOption=Catalogues[0]" data-ng-options="Catalogue as Catalogue.CName for Catalogue in Catalogues | filter:{ProductId:product.ProductId}:true" >                             
</select>
</li>
</ul>

控制器代码就像这样

 var app = angular.module('myApp', []);
 app.controller('myControl', function ($scope) {
 $scope.products = [{ productname: 'Rice1', ProductId: 1}, { productname: 'Rice2', ProductId: 2 },{ productname: 'Rice3', ProductId: 3 }];    
 $scope.Catalogues = [{ ProductId: 1, CatalogueId: 1, CName: '25KG Bag', Price: 500, sortorder: 1 }, { ProductId: 1, CatalogueId: 2, CName: '50KG Bag', Price: 1000, sortorder: 2 },{ ProductId: 2, CatalogueId: 3, CName: '100KG Bag', Price: 1800, sortorder: 2 }];

现在想要使用select下拉列表的第一个值动态设置每个产品catalogue.cname的默认值，任何想法？非常感谢！

http://plnkr.co/edit/9MYrj1YJt7HzLR9FGDqD?p=preview

Plnkr结果想要用“100KG Bag”设置第二次下拉

Answer 1

要在select中设置默认值，您需要将ng-model设置为您正在使用的列表中的第一个。把它放在控制器的末尾：

 $scope.SelectedOption = $scope.Catalogues[0];