Angularjs md-select不显示md-model

Question

我的页面上显示了两个md-select下拉框，出于某种原因，我可以从$scope中获取一个要显示的值，但不能显示另一个。

工作的md-select看起来像这样，并且工作正常：

<div class="col-md-4">
 <label for="">Units</label>                        
   <md-select style="margin:0px" name="units" ng-model="product.units" aria-label="select" required>
    <md-option value="kg">kg</md-option>
    <md-option value="g">g</md-option>
    <md-option value="mg">mg</md-option>
   </md-select>                       
  <span></span> 
</div>

不起作用的md-select如下所示：

<div class="form-group">
  <label for="">Supplier</label>
   <md-select style="margin:0px" ng-model="product.compname" name="supplier" aria-label="select" >
     <md-option value="kg">kg</md-option>
     <md-option value="kg">mg</md-option>
    </md-select> 
     <span></span>
</div>

我不知道为什么，但当我将"product.compname“替换为"product.units”时，它工作得很好。然而，当我尝试用"product.name“之类的其他产品数据替换它时，它也不起作用。

更新：

经过很多好的帮助后，我正在尝试像文档一样设置md-select，但我仍然有问题。我对这两个变量的作用域如下：

$scope.suppliers = data.data; 
$scope.selectedSupplier = [ $scope.suppliers[$scope.product.supplier] ];

在控制台中，供应商和selectedSupplier看起来都很好。在html页面上，我有以下内容，但它仍然不能工作。我可以看到列表中的所有供应商，但页面仍然加载，下拉框为空，没有选择任何选项。你认为如何？

<md-select ng-model="selectedSupplier" ng-model-options="{trackBy: '$value.id'}">
 <md-option ng-value="supplier" ng-repeat="supplier in suppliers">{{ supplier.compname }}</md-option>
</md-select>

Answer 1

你看过Angular材质演示了吗？

https://material.angularjs.org/latest/demo/select

我不确定为什么要将ng-value和ng-model都设置为product.compname的值？

最常见的用例是其中之一：

<md-select ng-model="drinkSelected">
    <md-option value="water">Water</md-option>
    <md-option value="juice">Juice</md-option>
    <md-option value="milk">Milk</md-option>
    <md-option value="wine">Wine</md-option>
    <md-option value="mead">Mead</md-option>
</md-select>

或

<md-select ng-model="drinkSelected">
    <md-option ng-repeat="drink in drinks" value="{{drink}}">{{drink}}</md-option>
</md-select>

注意:我不能评论，因为没有足够的代表，所以我已经回答了这个问题。

更新：

您的更新看起来很好。你能不能分享一下你的代码的一个精简版本，用的是plunker或者codepen？

Answer 2

也许您忘记了将'ngMaterial‘模块添加到列表中

var myApp = angular.module('microwaveGUI',['ngMaterial', 'ui.tree', 'angularResizable', 'ngMap', 'withLocals', 'ngRoute']);