在使用 bootstrap-multiselect 的多选下拉列表中使用 "selected" 属性时发生冲突，并与 angularjs "selected" 指令冲突

Question

我在我的项目中使用 bootstra-multiselect 和 angularjs。在测试期间，我发现 "selected" 属性名称在这两者之间发生冲突。以下是我对多 select 指令的 HTML 标记。

<select id="example-getting-started" multiple="multiple"  name="multiselect[]" data-dropdownmultiselect>    
    <option data-ng-repeat="option in options" value="{{getOptionId(option)}}" data-ng-attr-selected="{{isOptionSelected(option)}}" data-ng-bind-template="{{option.name}}"></option> 
</select>

我发现 data-ng-attr-selected="{{isOptionSelected(option)}}" 没有被 angularjs 编译。似乎正在应用 angular js "ng-selected" 指令，而不是我所需的普通属性。

如何解决这个问题？我不想更改代码或 bootstra-multiselect 或 angularjs 以避免将来的可维护性。 Angularjs 中有什么东西可以阻止运行其预定义的 "ng-selected" 指令吗？

以下是演示此问题的plunker代码 Angularjs and conflict of directive name with other module

Answer 1

您可以使用 ng-selected="expression"，它会在当前 select 选项中添加 selected 值为 selected 的属性，我不明白您为什么要使用ng-attr 而您可以使用 ng-selected="isOptionSelected(option)"

来控制它

标记

<select id="example-getting-started" multiple="multiple"  name="multiselect[]" data-dropdownmultiselect>    
    <option data-ng-repeat="option in options" value="{{getOptionId(option)}}" 
    ng-selected="isOptionSelected(option)" 
    data-ng-bind-template="{{option.name}}"></option> 
</select>

Working Plunkr

如果您还需要其他内容，请告诉我，谢谢 :)

在使用 bootstrap-multiselect 的多选下拉列表中使用 "selected" 属性时发生冲突，并与 angularjs "selected" 指令冲突

Conflict in use of "selected" attribute in multiselect dropdown using bootstrap-multiselect and conflict with angularjs "selected" directive

angularjs

angularjs-directive

angularjs-ng-repeat

ng-repeat

bootstrap-multiselect