Question

HTML代码

<grid-table table-rows="educationBoards"></grid-table>

角度控制器

angular.controller('gridController', function($scope){
   $scope.educationBoards = [{eid = 1, ename = "dhaka"}];
})

Angular Directive

angular.directive('gridTable', functions(){
   restrict: 'E',
   scope: {rows: '=tableRows'};
   link: function(scope){
     console.log(scope.rows); // shows undefined
   }
})

指令隔离范围在链接功能中不起作用。为什么??

Answer 1

这里有很多问题。

首先，控制器中的对象被错误定义：

$scope.educationBoards = [{eid = 1, ename = "dhaka"}];

应该是：

$scope.educationBoards = [{eid : 1, ename : "dhaka"}];

其次，您的功能被错误定义：

angular.directive('gridTable', functions(){

应该是：

angular.directive('gridTable', function(){

第三，在指令对象的中间有一个分号而不是逗号：

   scope: {rows: '=tableRows'}:

应该是：

   scope: {rows: '=tableRows'},

第四，你需要从指令返回对象，所以：


angular.directive('gridTable', functions(){
   restrict: 'E',
   scope: {rows: '=tableRows'};
   link: function(scope){
     console.log(scope.rows); // shows undefined
   }
})

应该是：


angular.directive('gridTable', function(){
   return {
     restrict: 'E',
     scope: {rows: '=tableRows'},
     link: function(scope){
       console.log(scope.rows);
     }
   };
})

现在它会起作用。这是一个小提琴：http://jsfiddle.net/tkkfqkaz/

角度隔离范围在链接功能中不起作用

1 个答案: