Angularjs +無法調用指令代碼

我是angularJS的新手，我無法弄清楚爲什麼指令沒有被調用我有單獨的js文件控制器的應用程序，單獨的js文件指令的應用程序;試圖爲每個文件創建單獨的文件;Angularjs +無法調用指令代碼

HTML代碼

<vertical-table data='fieldsList'></vertical-table>

控制器代碼

app.controller('MainCtrl', function($scope) { $scope.fieldsList =[{},{},{}]; });

指令代碼

angular.module('plunker').directive('verticaltable', function() { 
    console.log("field list initialzed"); 
    return{ 
     restrict: 'AE', 
     template: 'table.html', 
     replace: true, 
     transclude: true, 
     scope : { 
      data: "=" 
     }, 
     controller: function($scope, $elem){ 
      console.log("controller"); 

     }, 
     link:function($scope, elem){ 
      console.log("link"); 
     } 
    }; 
});

來源

2014-01-26 John Smith

我遇到同樣的問題，不能等待答案... –

嘗試'.directive（ 'verticalTable''，而不是'.directive（' verticaltable」，'（公告表中的首字母T） –

面對新問題:-)錯誤：模板必須只有一個根元素：是：table.html –

有一些錯誤修正：

angular.module('plunker').directive('verticalTable', function() { 
     console.log("field list initialzed"); 
     return{ 
      restrict: 'AE', 
      templateUrl: 'table.html', 
      replace: true, 
      transclude: true, 
      scope : { 
       data: "=" 
      }, 
      controller: function($scope){ 
       console.log("controller"); 

      }, 
      link:function(scope, elem){ 
       console.log("link"); 
      } 
     }; 
    });

使用templateUrl而不是template
與.directive('verticalTable',更換.directive('verticaltable'（注意表首都T）
刪除你的指令的控制器$elem參數，因爲你沒有一個名爲$elem服務。

DEMO

來源

2014-01-26 08:42:41

Angularjs +無法調用指令代碼

回答

相關問題