angularjs将绑定变量分配给html标记属性

Question

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

在这里，我们添加一个用于订购的选择框，就像这样

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

在控制器中，我们分配$scope.orderProp = "age"这很好，“最新”将是默认选择选项。

然后我尝试将订单商品放到模型中，然后像这样使用ng-repeat填充选择框。

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

哪里：

orderProp模型是：

function PhoneListCtrl($scope){

    $(document).ready($scope.orderProp = "age");

        $scope.orderProperties = [
            {"property":"Alphabetical","criteria":"name"},
            {"property":"Newest","criteria":"age"}
        ];
}

在dom我可以看到value="name"和value="age" 。 但这次默认值未设置为“最新”。 我不明白为什么硬编码value="age"正在工作，而value="{{orderby.criteria}}"则不然。 任何人都可以指导我完成。

Answer 1

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

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

http://docs.angularjs.org/api/ng.directive:select

Answer 2

您应该使用ng-option填充选择。