编程方式选择的MD-选择选项

我有多个选择的角度材料md-select元件，其余像这样定义：编程方式选择的MD-选择选项

在控制器的负荷我从服务器加载可用类型的阵列然后设置selectedTypes到availableTypes[0]（该availableTypes加载后）如下：

$scope.promise = Types.query(query, function (types) { // Types is a $resource 
     $scope.availableTypes = types; 
     $scope.selectedTypes = [$scope.availableTypes[0]]; 
});

因为selectedTypes是md-select指令的模式，我预计其将使第一个选择选项变为被选中。但它没有奏效。我无法在文档中找到以编程方式选择md-select中的元素的任何方法。

来源

2016-04-21 Avi

因此，您需要在页面加载时在'md-select'中选择一些预定义的值。对？ – nextt1

@ nextt1 - 的确如此。但是也会出现我想通过其他状态更改（不仅是页面加载）而以编程方式更改选择的情况。所以我更喜欢找到不仅与页面加载相关的解决方案。 – Avi

由于您使用的是md-select和multiple，因此绑定到md-select的模型必须是数组，并且您在代码中这样定义。

$scope.selectedTypes = [$scope.availableTypes[0]];

它不代表数组。您只需将您在md-option中指定的值添加到该模型。

$scope.selectedTypes = []; //defined array 
$scope.selectedTypes.push($scope.availableTypes[0]);

查看下面的笔的工作示例。

http://codepen.io/next1/pen/qZKzMy

在你的代码，你使用ng-value="{{type}}。由于ng-value是角度指令，因此不应使用{{ }}。查看官方文档ngValue

来源

2016-04-21 08:42:00 nextt1

感谢您的回答。其实我也尝试过这个，它不起作用。我假设我的代码和你的代码之间的区别是使用了一个回调，它使用我的代码中的服务器的结果VS示例中的线性无回调流。你有这个想法吗？ – Avi

我想因为你使用'ng-value'，所以你不需要'{{}}'因为它是一个角度指令。这可能是一个原因，如果你没有得到所需的结果。 https://docs.angularjs.org/api/ng/directive/ngValue – nextt1

你是对的！这是问题！您能否在我接受之前编辑您的答案以包含此内容？（你可以留下这个例子，我认为这对未来的其他人来说很好） – Avi

编程方式选择的MD-选择选项

回答

相关问题