使用AngularJS剑道指令在中添加剑道选项卡_Angularjs_Kendo Ui

使用AngularJS剑道指令在中添加剑道选项卡

angularjs kendo-ui

使用AngularJS剑道指令在中添加剑道选项卡,angularjs,kendo-ui,Angularjs,Kendo Ui,我对AngularJS和剑道UI都是新手。我注意到Kendo有一些AngularJS指令。我试图弄清楚如何使用剑道指令创建一个基本的选项卡控件。目前，我有以下几点： <div id="tabstrip" kendo-tab-strip> <ul> <li class="k-state-active">Tab 1</li> <li>Tab 2</li> </ul> <div>

我对AngularJS和剑道UI都是新手。我注意到Kendo有一些AngularJS指令。我试图弄清楚如何使用剑道指令创建一个基本的选项卡控件。目前，我有以下几点：

<div id="tabstrip" kendo-tab-strip>
  <ul>
    <li class="k-state-active">Tab 1</li>
    <li>Tab 2</li>
  </ul>

  <div>
    [Page 1]
  </div>
  <div>
    [Page 2]
  </div>
</div>

但是，选项卡控件没有渲染。我已经确认我已经包含angular-kendo.js。我有剑道网格渲染。所以我知道我已经正确地连接了剑道指令库。我做错了什么？

您的html是正确的，指令也是正确的。不能正确地注入指令，否则会丢失一些kendos js。查看此

您没有实例化angular应用程序

将以下内容添加到代码段的顶部。这是使您的样本正常工作所需的最低要求：

<html>
<head>
<link rel="stylesheet" href="//cdn.kendostatic.com/2014.2.1008/styles/kendo.common.min.css">
<link rel="stylesheet" href="//cdn.kendostatic.com/2014.2.1008/styles/kendo.default.min.css">
</head>
<body ng-app='app'>
<script src="//code.jquery.com/jquery-1.10.0.min.js"></script>
<script src="//code.angularjs.org/1.3.0/angular.min.js"></script>
<script src="//cdn.kendostatic.com/2014.2.1008/js/kendo.all.min.js"></script>
<script>
  angular.module('app',['kendo.directives']);
</script>