Kendo UI/Angular: 如何在 ng-repeat 中 assign/obtain 处理程序

Question

我在 Kendo UI/Angular 中有以下颜色选择器小工具。请注意 k-on-change 工作正常：

<input kendo-color-picker="theColor" k-on-change="c=theColor.value()" />

现在，我需要的是在一个列表中有几个颜色选择器小工具，就像这样（注意这不起作用）：

 <ul>
   <li style="list-style-type:none" ng-repeat="color in colors">
      <input kendo-color-picker="theColor" k-on-change="color.c=theColor.value()" />
   </li>
</ul>

上面代码中的问题是我无法为每个事件分配相同的 theColor 处理程序。有什么解决办法吗？

Answer 1

KendoUI 在其文档中指出 ng-repeat 在初始化后将无法正常工作。他们推荐使用数据源，我已经建立了一个工作示例 here

您可以使用DataSource 或ObservableArray。例如：

app.js

var app = angular.module('app', ['kendo.directives']);

app.controller("myCtrl", function($compile, $scope) {

  $scope.tree = new kendo.data.ObservableArray([{
    text: "Foo",
    items: [{
      text: "Foo 1"
    }, {
      text: "Foo 2"
    }]
  }, {
    text: "Bar",
    items: [{
      text: "Bar 1"
    }, {
      text: "Bar 2"
    }]
  }, ]);
});

html

<body ng-app="app" ng-controller="myCtrl">
  <h1>AngularJS + kendo</h1>

  <div kendo-grid k-data-source="tree" k-columns='[
                      { "template":"<input kendo-color-picker=\"theColor\" k-on-change=\"color.c=theColor.value()\" />"}
                  ]'>
  </div>


</body>

Kendo UI/Angular: 如何在 ng-repeat 中 assign/obtain 处理程序

Kendo UI/Angular: how to assign/obtain handler in ng-repeat

kendo-ui

angularjs