【问题标题】:can i use angular js with kendoUi wrappers? if yes how?我可以将 angularjs 与剑道 Ui 包装器一起使用吗?如果是的话怎么办?
【发布时间】:2013-05-21 11:03:04
【问题描述】:

我有 3 个问题

  1. 我可以在 kendoUi 包装器中使用 Angular js 吗?如果是,如何?
  2. 如果我在同一个 html 标签上使用 angular js 和 kendo-all.min.js,假设我们正在将输入标签转换为自动完成,同时我们将它与 ng-model 绑定,那么它们可能相互产生的影响?
  3. 究竟什么是角剑道?

第 2 点的代码

<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/Kendo/kendo.all.min.js"></script>

<script src="~/Scripts/angular/angular.js"></script>
<script src="~/Scripts/angular/app.js"></script>*@

<script type="text/javascript">

    $(document).ready(function () {
    var data = ["akshay", "tiwari", "ranjit", "swain"];
    $("#name").kendoAutoComplete({ dataSource: data });
})

</script>

<h2>KendoAngular</h2>

<div ng-app>
    <input id="name" type ="text" ng-model="yourName"/>
    <h2>{{yourName}}</h2>

</div>

【问题讨论】:

    标签: angularjs kendo-ui kendo-asp.net-mvc


    【解决方案1】:
    1. 您需要包含一个剑道项目:https://github.com/kendo-labs/angular-kendo

    2. 将会发生的情况是,当用户键入自动完成时,选择将绑定到角度范围项目。 “包装器”是所有绑定并允许更新角度的原因。

    3. 来自 github:angular-kendo 是 AngularJS 的指令,它通过 Kendo UI 声明式初始化运行元素,允许您在 AngularJS 应用程序的上下文中充分利用 Kendo UI。

    你的 plunker 不包括上面链接中的角度适配器。

    以下是其使用说明:http://kendo-labs.github.io/angular-kendo/#/simple

    var app = angular.module('your-angular-app', ["kendo.directives"]);  // include directives
    

    添加data-kendo 和适当的data- 属性。

    【讨论】:

    • 感谢您的回复,但是当我尝试第二点时,实际发生的事情是两者都单独工作,这意味着当我使用键盘时自动完成和角度绑定工作以及当我选择任何自动完成列表中的项目比角度绑定不起作用
    • 你能添加一个演示插件吗?
    • Fork 这个:plnkr.co/edit/knigGbcbedYVkGd1Vsfj 然后如果你能得到一个工作演示。
    • 这里是 jsfiddle jsfiddle.net/akki166786/MYe2T 的链接,这是我的新问题 stackoverflow.com/questions/17066799/… 的链接
    猜你喜欢
    • 2014-05-21
    • 1970-01-01
    • 2023-04-10
    • 2014-04-16
    • 2021-11-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-06-24
    相关资源
    最近更新 更多