AngularJS指令在數據開始時無法識別 -

Question

我是AngularJS的新手。需要一些幫助我創建的指令。 這是我的HTML：

<data-table template-url="dataTable.html" info="someData"></data-table> 

我得到「someData」從服務器在我的控制器 - directive.js：

app.directive('dataTable', function() { 
return{ 
    restrict: 'E', 
    scope: { 
     data : '=info' 
    }, 
    link: function($scope,elem,attrs){ 
     ///some code here. 
    }, 
    templateUrl : function(elem, attrs) { 
     return attrs.templateUrl; 
    } 
}); 

的問題是，當我調試我的代碼，通過它來指令不進去。 （我在Chrome中使用javascript調試）。有什麼我失蹤了嗎？限制標籤是正確的，名稱是正確的還需要什麼？我看過類似的問題，但找不到任何解決方案。這裏是一個小提琴：Demo

Answer 1

您不能使用以data-*開頭的指令名稱，因爲它由AngularJS ng core namespaces保留。只需使用其他名稱開始，你會沒事的。

<my-data-table template-url="dataTable.html" info="someData"></my-data-table> 

而且你的指令：

myApp.directive('myDataTable', function() { 
    return { 
    scope: { 
     data: '=info' 
    }, 
    link: function($scope, elem, attrs) { 
     ///some code here. 
     console.log(attrs.templateUrl); 
    }, 
    templateUrl: function(elem, attrs) { 
     return attrs.templateUrl; 
    } 
    } 
});