如何限制 md-multiple-select 中的选项选择？答案

【问题标题】：How to restrict selection of options in md-multiple-select?如何限制 md-multiple-select 中的选项选择？
【发布时间】：2017-06-23 06:00:20
【问题描述】：

我需要限制用户从多选选项中仅选择 2 个选项.....我检查了多个限制，例如 multiple-limit="value here"... 这里是Codepen....

【问题讨论】：

就我看到的谷歌和文档而言，没有明确的解决方案。我会编写自己的 md-select-max-selection 指令并在那里处理这种情况。
@Ursache....所以现在有办法从物质方面实现这一目标？？
我找不到任何东西。让我们看看其他建议:)
如果你能......请帮助我提供你在第一条评论中提到的指令......
白天会。

标签： angularjs material-design angular-material multi-select

【解决方案1】：

正如我在问题 cmets 中所读到的，该指令不（尚未）支持开箱即用的限制选择。但是，我们可以采用以下解决方法来实现类似的目标：

我们将添加一个ng-change，它监听指令的ng-model 并为我们提供最新值。然后我们决定最新的值是否超过了选择的限制，如果是，我们为模型分配一个先前保存的具有最大选择的副本。

假设下例中的限制为 2：

$scope.changed = function(val) {
  if(val && val.length > 2) {
    $scope.myModel = $scope.prevModel;
  } else {
    $scope.prevModel = val;
  }
}

Working codepen

【讨论】：

有趣....但只需打开控制台，将 val 放入 console.log 更改功能并检查第一个、第二个和第三个框....您的 val 包含第三个检查值，这意味着ng-model 持有.....这不是必需的值
@SaEChowdary 它将在下面被覆盖.. 你在哪里控制台记录它？你可以分叉代码笔并在这里分享吗？
我的坏伙伴......我没有检查视图部分......这很好，如果我有任何疑问会回复你
@SaEChowdary 同时，如果有帮助，您可以投票赞成答案:) 如果有疑问，请务必回复我

【解决方案2】：

抱歉回复晚了，这是我的自定义指令：

https://codepen.io/anon/pen/bRoNWx

link: function(scope, element, attrs, ngModel) {
      scope.$watch(function () {
              return ngModel.$modelValue;
           }, function(newValue, oldValue) {
               if (newValue && newValue.length > attrs.mdSelectMaxSelection) {
                 ngModel.$setViewValue(oldValue);
                 ngModel.$render();
               }
           });
    }

您还可以对模型使用验证器，并通知用户为什么他不能选择更多元素。此外，您可以直接在模板中使用验证器名称。

【讨论】：