Question

我使用Bonita UI创建了一个自定义窗口小部件。我想创建一个带有搜索字段的多选下拉小部件。我按照示例https://embed.plnkr.co/KpVqaiblOKGk5K6VWmi4/进行操作，并已在Bonita UI中添加了所有资产，但是无法检索dropdown-multi select属性，并且出现错误：

vendor.min.js:105 Error: [ng:areq]

为了进行测试，我在代码内添加了JSON值。没有错误，但无法检索选项值。 模板：

<!DOCTYPE html>
<div ng-app="App" ng-controller="MyController" class="container">
Angular dropdown multiselect 
<div>
<dropdown-multiselect dropdown-config="config"
model="selectedItems"> 
</dropdown-multiselect>
</div>
<br>
<pre> Selected Items = {{selectedItems | json}} </pre>
</div>

**控制器：**

angular.module( 'App', [ 'dropdown-multiselect' ])
.controller("MyController", function ($scope){
var options = [ {
     'Id': 1,
     'Name': 'Batman',
     'Costume': 'Black'
     }, {
     'Id': 2,
     'Name': 'Superman',
     'Costume': 'Red & Blue'
     }, {
     'Id': 3,
     'Name': 'Hulk',
     'Costume': 'Green'
     }, {
     'Id': 4,
     'Name': 'Flash',
     'Costume': 'Red'
     }, {
     'Id': 5,
     'Name': 'Dare-Devil',
     'Costume': 'Maroon'
     }, {
     'Id': 6,
     'Name': 'Wonder-woman',
     'Costume': 'Red'
     }]

$scope.config = {
options: options,
trackBy: 'Id',
displayBy: [ 'Name', 'Costume' ],
divider: ':',
icon: 'glyphicon glyphicon-heart',
displayBadge: true,
height: '200px',
filter: true,
multiSelect: true
}
})

当我尝试删除指令代码部分时，控制台没有错误，但是没有可检索的内容。我将不胜感激。谢谢。

<div>
<dropdown-multiselect dropdown-config="config" model="selectedItems">
</dropdown-multiselect>
</div>
<br>
<pre> Selected Items = {{selectedItems | json}} </pre>
</div>


function ($scope){
var options = [ {
'Id': 1,
'Name': 'Batman',
'Costume': 'Black'
}, {
'Id': 2,
'Name': 'Superman',
'Costume': 'Red & Blue'
} ]

$scope.config = {
options: options,
trackBy: 'Id',
displayBy: [ 'Name', 'Costume' ],
divider: ':',
icon: 'glyphicon glyphicon-heart',
displayBadge: true,
height: '200px',
filter: true,
multiSelect: true
}
})

Bonita UI中使用AngularJS的多选下拉式自定义小部件

0 个答案: