Angularjs为HTML标签属性分配绑定变量

angularjs assigning bind variables to html tag properties

本文关键字：分配 绑定 变量 属性 标签 HTML Angularjs      更新时间：2023-09-26

我正在浏览Angularjs官方网站上给出的tuts和docs。

这里我们添加了一个排序的selectbox，像这样

  <select ng-model="orderProp">
   <option value="name">Alphabetical</option>
   <option value="age">Newest</option>
  </select>

和在控制器中，我们分配$scope.orderProp = "age"这工作得很好，' latest '将是默认选择选项。

然后我尝试将订单项放入模型并使用ng-repeat填充选择框，就像这样。

  <select ng-model="orderProp">
    <option ng-repeat="orderby in orderProperties" value="{{orderby.criteria}}">{{orderby.property}}</option>
  </select>

地点:

orderProp model is:

function PhoneListCtrl($scope){
    $(document).ready($scope.orderProp = "age");
        $scope.orderProperties = [
            {"property":"Alphabetical","criteria":"name"},
            {"property":"Newest","criteria":"age"}
        ];
}

在dom中我可以看到value="name"和value="age"。但是这次默认值没有设置为"latest"。我不明白为什么硬编码的value="age"是工作的，而value="{{orderby.criteria}}"不是。谁能给我指路?

您正在以错误的方式使用select:

<select ng-model="orderProp" 
    ng-options="orderby.criteria as orderby.property for orderby in orderProperties">
</select>

http://docs.angularjs.org/api/ng.directive:选择

您应该使用ng-option来填充select.

相关文章：