访问Angular.js中的选定对象属性

Question

我是angular的新手，正在一起使用angular.js和angular-material。

我想做的是创建一个md-select并将对象分配为ng-model。 我的md-options来自对象数组，当我选择所需的选项时，整个对象都存储在ng-model中。

问题是，在此之后，我尝试选择该对象的属性时，不会返回任何内容。 您可以在这里看到我的代码：

<md-input-container md-no-float class="md-block col-1111-20-0-fl mrg-l-20">
      <md-select ng-model="orderItems[$index].item">
         <md-option ng-repeat="item in itemNames[$index] | orderBy: item.name" value="{{item}}">
           {{item.name}} - {{item.price | currency : 'R$' : 2}}
         </md-option>
       </md-select>
    </md-input-container>

    {{orderItems[$index].item.name}}

如果我只写{{orderItems [$ index] .item}}，则会访问整个对象，将其显示为一个对象及其属性，如下所示：

{“ _id”：“ 5812cfdb1c27a7187c61b8c1”，“价格”：“ 2”，“名称”：“水瓶500ml”}

但是当我写：

{{orderItems [$ index] .item.name}}

我无法访问对象的名称，没有任何显示。

我在这里做错了什么？

谢谢！

Answer 1

您在ng-repeat中使用的$index不适用于父级md-select因此您无法使用该数字为orderItems数组建立索引。 另外，根据有角度的材料文档，您不需要为value属性评估value="{{item}}" 。

如果只想存储选择为对象的值，则可以执行以下操作：

<md-input-container md-no-float class="md-block col-1111-20-0-fl mrg-l-20">
  <md-select ng-model="selectedItem">
    <md-option ng-repeat="item in itemNames | orderBy: item.name" ng-value="item">
      {{item.name}} - {{item.price | currency : 'R$' : 2}}
    </md-option>
  </md-select>
</md-input-container>