AngularJS中如何将ng-options转换为ng-repeat（Angular Material场景）

你完全不需要创建新指令！AngularJS Material的<md-select>组件本身就是通过<md-option>配合ng-repeat来生成选项的，正好可以替代ng-options的功能。

针对你原来的ng-options="(k.x.y) as k.x.z for k in q"，我们可以拆解成以下逻辑：

• 遍历集合q中的每一项k
• 将k.x.y作为选项对应的模型值（即选中后绑定到ng-model的值）
• 将k.x.z作为选项的显示文本

对应的转换代码如下：

<md-select ng-model="yourSelectedModel">
  <md-option ng-repeat="k in q" ng-value="k.x.y">
    {{k.x.z}}
  </md-option>
</md-select>

关键说明： #

• 使用ng-value来绑定选项的实际值（对应ng-options里的(k.x.y)部分），这比直接用value属性更靠谱，尤其是当k.x.y是对象类型时
• ng-repeat="k in q"对应原语法里的for k in q
• 选项内部的{{k.x.z}}就是原语法里的as k.x.z部分，用来展示用户看到的文本

如果你的k.x.y是简单的字符串/数字，也可以用value="{{k.x.y}}"，但更推荐ng-value，它能直接绑定变量，不需要字符串插值。

内容的提问来源于stack exchange，提问作者Vlad Udod