带有角度材料的三态md复选框

Question

我正在使用Angular材料1.0.5和md-checkbox指令.我想知道是否有人知道如何将其变为三态复选框.

三种状态(以及我的情况的相关变量值)是:

• 检查(真实)
• 未选中(false)
• 不确定(null)

对于指定的Angular Material版本(1.0.5),当禁用该复选框时,它会将不确定状态显示为带有问号的复选框.

但是,如果未禁用它,则默认返回到两个状态复选框.

到目前为止,我失败的尝试是将指令包装在另一个指令中并尝试接管md-checkbox的控制权.

在这种情况下有没有人有任何指示？

谢谢.

Answer 1

如果使用角度材质> 1.0.8,则可以使用该md-indeterminate属性并使用自己的ng-change函数管理该值.

HTML

<md-checkbox ng-model="vm.checkModel" 
             md-indeterminate="vm.checkModel === null" 
             ng-change="vm.checkModelChange()">
    Checkbox
</md-checkbox>

CONTROLLER

var checkValues = [false, true, null];
var index = 0;
vm.checkModel = checkValues[index];

vm.checkModelChange = function() {
  vm.checkModel = checkValues[++index % checkValues.length];
}

• 检查此JSFIDDLE是否有角度材质> 1.0.8.(最佳解决方案)

• 检查此JSFIDDLE是否有角度材质1.0.5.(我使用ng-class css来模拟不确定状态).