0

我正在使用更多的依賴模塊爲各種application.I想顯示ngtable使用指令。但這不起作用。 有時沒有錯誤,有一次我得到以下錯誤 'DemoCtrl'控制器未定義如何解決此問題。Angularjs-more模塊依賴問題

的index.html:

<!DOCTYPE html> 
<html ng-app="mrm"> 
<head lang="en"> 
<meta charset="UTF-8"> 
<title>Application</title> 

<link rel="stylesheet" href="css/ocModal.light.css"> 
<link rel="stylesheet" href="css/ocModal.animations.css"> 

<link data-require="[email protected]*" data-semver="0.3.0" rel="stylesheet" href="css/ng-table.css" /> 

<script src="jquery-1.11.1.min.js"></script> 
<script src="angular.min.js"></script> 


<script src="app/app.js"></script> 
</head> 
<body> 
<div class="container"> 
     <dpangTable></dpangTable> 
</div> 

<script data-require="[email protected]*" data-semver="0.3.0" src="ng-table.js"></script> 

<script src="ngTable/ngTable.js"></script> 
<script src="ngTable/ngTable-directive.js"></script> 
</div> 
</body> 
</html> 

app.js:

(function() { 
var app = angular.module('mrm', ['ngRoute', 'mrm.lightbox','mrm.ngtbls']); 

})(); 

ngTable.js:

(function(){ 

var app = angular.module('mrm.ngtbls',['ngTable']); 
app.controller('DemoCtrl',['$scope','ngTableParams', function($scope, ngTableParams) { 
var data = [{name: "Moroni", age: 50}, 
      {name: "Tiancum", age: 43}, 
      {name: "Jacob", age: 27}, 
      {name: "Nephi", age: 29}, 
      {name: "Enos", age: 34}, 
      {name: "Tiancum", age: 43}, 
      {name: "Jacob", age: 27}, 
      {name: "Nephi", age: 29}, 
      {name: "Enos", age: 34}, 
      {name: "Tiancum", age: 43}, 
      {name: "Jacob", age: 27}, 
      {name: "Nephi", age: 29}, 
      {name: "Enos", age: 34}, 
      {name: "Tiancum", age: 43}, 
      {name: "Jacob", age: 27}, 
      {name: "Nephi", age: 29}, 
      {name: "Enos", age: 34}]; 

$scope.tableParams = new ngTableParams({ 
    page: 1,   // show first page 
    count: 10   // count per page 
}, { 
    total: data.length, // length of data 
    getData: function($defer, params) { 
     alert("asfasF"); 
     $defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() *   params.count())); 
    } 
}); 
}]); 

})(); 

ngTable-directive.js:

(function(){ 
var app=angular.module('mrm.ngtbls',[]); 
app.directive('dpangTable',[function(){ 
    return { 
     restrict:'E', 
     replace:true, 
     controller:'DemoCtrl', 
     templateUrl:'app/views/ngTable.html', 
     link:function(scope,element,attr){ 
     } 
     } 
     }]); 
     })(); 

ngTable.html:

<div ng-controller="DemoCtrl"> 
    <p><strong>Page:</strong> {{tableParams.page()}}</p> 
    <p><strong>Count per page:</strong> {{tableParams.count()}}</p> 

    <table ng-table="tableParams" class="table"> 
    <tr ng-repeat="user in $data"> 
     <td data-title="'Name'">{{user.name}}</td> 
     <td data-title="'Age'">{{user.age}}</td> 
    </tr> 
    </table> 
    </div> 

回答

0

在ngTable-directive.js您有效地覆蓋您在ngTable.js定義是什麼。您必須省略angular.module()內的第二個參數。然後你將取出模塊而不是重新定義它。

您還應該將全部腳本標記放在頭部分或身體部分的末尾。關於Angular,我建議將所有內容放在腦海中,因爲我可以想象Angular的引導(它監聽DOMContentLoaded事件)可以防止某些模塊被隨時添加(隨機)。

+0

你可以編輯我的code.using jsfiddle – 2014-09-29 19:40:47

+0

不..這是不工作 – 2014-09-29 19:51:08