ng-controller不适用于kendo tabstrip标签内容

ng-controller不适用于kendo tabstrip标签内容。请检查我的代码如下。ng-controller不适用于kendo tabstrip标签内容

<!--tabstripCtrl.js--> 
 
angular.module('tabstripApp',[]); 
 

 
var app = angular.module('tabstripApp'); 
 

 
app.controller('tabCtrl',['$scope',function($scope){ 
 
    $('#tabstrip').kendoTabStrip({ 
 
    contentUrls:[ 
 
     'views/gridview1.html', 
 
     'views/gridview2.html', 
 
     'views/gridview3.html', 
 
    ] 
 
    }); 
 
}]); 
 

 
<!--grid1Ctrl.js-->  
 
var app = angular.module('tabstripApp'); 
 

 
app.controller('grid1Ctrl',['$scope',function($scope){ 
 
    $scope.grid1 = "grid1"; 
 
}]);

<!--index.html--> 
 
<html> 
 
<head> 
 
    <link rel="stylesheet" href="css/kendo.common.min.css"> 
 
    <script src="js/jquery.min.js"></script> 
 
    <script src="js/angular.min.js"></script> 
 
    <script src="js/angular-route.min.js"></script> 
 
    <script src="js/kendo.all.min.js"></script> 
 
    <script src="controllers/tabstripCtrl.js"></script> 
 
    <script src="controllers/gridCtrl.js"></script> 
 
</head> 
 

 
<body ng-app="tabstripApp" ng-controller='tabCtrl'> 
 
    <div id='tabstrip'> 
 
     <ul> 
 
      <li class="k-state-active">grid1</li> 
 
      <li>grid2</li> 
 
      <li>grid3</li> 
 
     </ul> 
 
     <div ng-controller="grid1Ctrl"></div> 
 
     <div ng-controller="grid2Ctrl"></div> 
 
     <div ng-controller="grid3Ctrl"></div> 
 
    </div> 
 
</body> 
 
</html> 
 

 
<!--gridview1.html--> 
 
<div> 
 
    <span>{{grid1}}</span> 
 
</div>

由于每个选项卡的内容是非常复杂的，所以我创建单独的HTML文件maintan他们。但是，grid1Ctrl，grid2Ctrl和grid3Ctrl绑定不起作用，有什么想法？

来源

2016-12-05 Allen4Tech

因为你还没有将它们定义 – Sajeetharan

@Sajeetharan喜，更新，我没有上传标签内容的视图和控制器，但我确定他们。 – Allen4Tech

我认为你错过了一些东西，你可以创建一个重击者 – Sajeetharan

<div ng-controller="myController"> 
    <div id="tabstrip" kendo-tab-strip="tabstrip"> 
     <ul> 
     <li class="k-state-active">grid1</li> 
     <li>grid2</li> 
     <li>grid3</li> 
     </ul> 
     <div ng-controller="grid1Ctrl"> 
     {{grid1}} 
     </div> 
     <div ng-controller="grid2Ctrl"> 
     {{grid2}} 
     </div> 
    </div> 
    </div>

DEMO

来源

2016-12-05 07:01:04 Sajeetharan

谢谢，我知道这个作品。但是我不想将标签内容直接放在索引文件中，因为每个内容都非常复杂，这会使索引文件变得非常大。所以我使用ContentUrls从不同文件加载内容。控制器绑定不适用于单独的内容文件。您可以通过我的邮政编码重新编制问题。 – Allen4Tech

@ Allen4Tech那么你需要使用路由机制。检查示例http://plnkr.co/edit/peXM2XSosnWnBgmp1fty?p=preview – Sajeetharan

谢谢！但如何防止在URL中选择的路径显示？ – Allen4Tech

ng-controller不适用于kendo tabstrip标签内容

回答

相关问题