Question

When I read https://docs.telerik.com/kendo-ui/AngularJS/introduction , it seems to suggest that for any event defined in the API for, I can use k-on- prefix instead of the k- prefix to set the event in such a way that it runs inside of the digest loop:

Setting Handlers through k-on Attribute
You can also specify event handlers by using attributes. They require the k-on- prefix.
<div ng-app="app" ng-controller="MyCtrl">
   <input kendo-date-picker k-on-change="onDateSelected(kendoEvent)" />
   <p ng-show="selected">A month was picked</p>
 </div>

…

The kendoEvent variable is defined in a scope and you have to pass it to the event handler. If you are using the k-on- attributes, you do not need to call $digest() on the scope because your bindings take care of it.

However, when I try to do this with file-upload’s select event, my handler never runs:

<input name="files"
  type="file"
  kendo-upload
  k-async="{ saveUrl: 'save', removeUrl: 'remove', autoUpload: true }"
  k-on-select="onSelect"
  />

My handler does run if I pass it as k-select instead, but then sometimes the changes I make to $scope don’t result in my screen being updated.

Am I reading the Kendo documentation correctly? How do I work around this issue?

Answer 1

实际上，k-on-select属性确实起作用。但是，k-on-select将使用Scope#$eval并将其作为表达式执行。这是事件的AngularJS约定。由于我传递了可解析为函数的表达式，所以每次对k-on-select进行求值时都没有任何反应。

要在表达式中调用函数，必须使用函数调用语法«function»()。在kendo的AngularJS支持下，它在名为kendoEvent的变量中传递事件信息（而在AngularJS中生成的事件在名为$event的变量中传递事件信息）。我更正后的代码如下：

<input name="files"
  type="file"
  kendo-upload
  k-async="{ saveUrl: 'save', removeUrl: 'remove', autoUpload: true }"
  k-on-select="onSelect(kendoEvent)"
  />

感谢Lex在his comment中指出了这一点！

How do I update scope from file-upload k-select event?

1 个答案: