Question

我有以下代码，我使用ng-repeat和md-select。但它不起作用，下拉显示为空白。如果我使用ng-repeat与div或html选择它是有效的。请看下面的，

Angularform： -

<div class="col-xs-12 formClass" ng-controller="dropDownController">
  <md-input-container class="formClass">
    <label>Impacts</label>
      <md-select name="impact" id="impact" ng-model="impact">
        <md-option  ng-repeat="impact in impacts.availableImpacts" value="{{impact.id}}">{{ impact.name }}
        </md-option>
      </md-select>
  </md-input-container>
</div>

JS： -

app.controller('dropDownController', function ($scope) {          
  $scope.impacts = {
    availableImpacts: [
                        {id: '1', name: 'name1' },
                        { id: '2', name: 'name2' },
                        { id: '3', name: 'name3' }
                      ],
 };
});

Answer 1

我的角度版本对我来说是旧的md-input-container没有这个标签工作

<!--<md-input-container>-->
     <label>impact</label>
       <md-select ng-model="selectedImpact">
          <md-option  ng-repeat="impact in impacts.availableImpacts" value="{{impact.name}}">
        {{impact.name}}
      </md-option>
    </md-select>
<!--  </md-input-container>-->

Answer 2

将您的md-option标记更改为：

public function rules()
{
    return [
        'price'=>'foo'
    ];
}

使用ng-value而不仅仅是值并删除{{}}。

请查看documentation了解更多示例。

您的项目中包含适当的角度材质脚本吗？

Answer 3

您绑定数据的方式似乎存在问题，

这对我有用，

<md-input-container>
     <label>impact</label>
    <md-select ng-model="selectedImpact">
      <md-option  ng-repeat="impact in impacts.availableImpacts" value="{{impact.name}}">
        {{impact.name}}
      </md-option>
    </md-select>
  </md-input-container>

请参阅plunker

Answer 4

这可能与此票证有关：Angularjs md-options are showing in Inspect but not on screen

即使存在“选项”DOM元素，我也遇到md-select没有显示下拉列表的问题。

我发布了关于我的特定问题的这张票：md-select doesnt display options and causes freezing

Angularjs ng-repeat不使用md-select和md-option

4 个答案: