如何使用 angularjs 将所选项目附加到 Kendo 多选？答案

【问题标题】：how to append selected items to a Kendo multiselect using angularjs?如何使用 angularjs 将所选项目附加到 Kendo 多选？
【发布时间】：2014-08-07 13:48:15
【问题描述】：

检查这个：http://jsfiddle.net/nDmjt/5/

$("#button").on("click", function () {
var res =  multiselect.value().slice();
    res.push('customerStatusIds:25');
    res.push('priorityIds:1');


    multiselect.dataSource.filter({});
    multiselect.value(res) 

});

您对如何使用 angular js 实现相同的行为有任何想法吗？提前致谢。

【问题讨论】：

标签： angularjs kendo-ui

【解决方案1】：

角度：

$scope.data = { names: []};

$scope.nameDataSource = new kendo.data.DataSource({
      data: [{ name: 'Vignesh' }, { name: 'Rizwan' }]
});

$scope.nameOptions = {
      placeholder: "Select",
      dataSource: $scope.nameDataSource ,
      dataTextField: "name",
      dataValueField: "name",
      valuePrimitive: true,
      autoBind: false
}  

$scope.data.names.push('Riyaz');

HTML：

<select id="name" kendo-multi-select ng-model="data.names" k-data-source="nameDataSource" k-option-label="{name: 'Name'}" k-options="nameOptions" style="width:200px"></select>

【讨论】：

【解决方案2】：

查看与 Kendo-ui/multiselect/angular 相关的 link

他们为我们提供了一个适合您的问题的示例。

我使用此示例将所选项目附加到 MultiSelect。

控制器内部：

例子：

$scope.ToothOptions = {
        autoBind: false,
        dataSource: $scope.toothsDataSource, // datasource
        dataTextField: 'ToothQuarterName',
        dataValueField: 'ToothID',
        filter: 'contains'
        valuePrimitive: true
    };

$scope.SelectedTooths=[];

UI（视图）

<input class="form-control input-xs" 
       kendo-multi-select
       k-options="ToothOptions" 
       k-ng-model="SelectedTooths" />

如果你只是用[5,6] 之类的值更新数组$scope.SelectedTooths，那么多选将用tooths(toothID : 5, toothID:6) 更新。

【讨论】：