设置使用ng-repeat生成的下拉列表的默认值

Question

<ul ng-repeat="books in companyBookData.Bookparts" style="float: left">
    <li>
        <select 
            name="Zone" 
            id="Zone" 
            ng-options=" ZoneType.Description for ZoneType in books.ZoneTypes" 
            ng-model="ZoneType" 
            ng-init="ZoneType=books.ZoneTypes[0]">
        </select>
    </li>
<ul>

我有使用ng-repeat生成的下拉菜单，如上所示。我将至少有4个下拉菜单，最多100个，我明白ng-repeat会在每次迭代时创建一个新的范围。如何设置每个下拉菜单的默认值？我是否可以访问ng-repeat生成的所有范围？如何设置默认值？

Answer 1

试试这个

ng-init="ZoneType= ZoneType || books.ZoneTypes[0]">

Answer 2

您无法为ng-model和ng-options分配相同的属性。您可以使用ng-init，只需定义一个新变量来存储所选对象。

<ul ng-repeat="books in companyBookData.Bookparts" style="float: left">
    <li ng-init="selectedZoneType=books.ZoneTypes[0]">
        <select 
            name="Zone"
            ng-options=" ZoneType.Description for ZoneType in books.ZoneTypes" 
            ng-model="selectedZoneType">
        </select>
    </li>
<ul>

不要在ng-repeat中定义id，否则你将在html中获得重复的id。除非你使用$ index使它们成为唯一的。

Answer 3

<ul ng-repeat="books in companyBookData.Bookparts" style="float: left">
<li>
    <select 
        name="Zone" 
        id="Zone" 
        ng-options=" ZoneType.Description for ZoneType in books.ZoneTypes" 
        ng-model="ZoneType" 
        ng-init="ZoneType=books.ZoneTypes[0]"
        ng-controller="ZoneTypeController"
        >
    </select>
</li>

根据Whisher的建议，我添加了ng-controller指令并在那里设置默认值。对于companyBookData.Bookparts的每次迭代都会调用此控制器。