复选框未显示在md-select multiple中

时间:2017-01-05 14:47:28

标签: javascript angularjs angular-material md-select

我正在尝试在我的md-select中启用多选。我已将multiple硬编码为true,但除了下拉列表中的值之外,md-select并未显示checkbox

我正在使用AngularJS 1.4.8和AngularMaterial 1.0.0。

代码:

<div style="background: #f7f7f7" ng-controller="CircleTimeActivityPageController">

            <md-input-container flex="30">
                     <md-select multiple="true" placeholder="Observations" ng-model="myData">
                          <md-option ng-value="selectedObservation" ng-repeat="selectedObservation in observations">
                                    {{ selectedObservation }}</md-option>
                     </md-select>
            </md-input-container>

 </div>

mainApp.controller('CircleTimeActivityPageController', function($scope, $http, $mdToast, $log) {
    $scope.observations = [1.3, 1.2, 1.1];
});

enter image description here

请原谅我在AngularJS和AngularMaterial中的无知。

修改

CODEPEN示例:https://codepen.io/wingoku/pen/ZLYxNY

最好的问候

2 个答案:

答案 0 :(得分:2)

我认为这只是一个版本问题。 如果您将angular-material版本升级到最新的 1.1.1 ,则问题将得到解决,您可以在此working plunker中看到。

...
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.1/angular-material.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.1/angular-material.js"></script>
...

希望有所帮助

答案 1 :(得分:0)

Angular-material 1.0不显示select multiple下拉列表中的复选框 - 相反,所选元素的颜色会发生变化。在您的codepen示例中很难看到,因为主题颜色非常接近默认的未选择的黑色 - 请查看the same example with a pink theme instead并且您会看到它更容易看到。无论复选框如何,功能都应该存在。

如果您想要复选框,则需要使用较新版本的角度材质 - 例如1.1.0版本具有这些版本。