无法获取隔离范围的值

问题描述：

无法获取隔离作用域的值“检查”。出于测试目的，我将索引值传递给“检查”。当ng-repeat完成时我必须添加动画，但是“scope。$ last”也给出了未定义的值。我不会发现我的代码语法或逻辑中有什么问题。无法获取隔离范围的值

angular.module('myApp',[]) 
 
.directive('track',function(){ 
 
    return{ 
 
     restrict:'E', 
 
     scope: { check : "="}, 
 
     template:`<div class="routeTable"><table class="table" id="road"> 
 
        <tr ng-repeat="level in levels"> 
 
         <td ng-repeat="lane in lanes" check = {{$index}}></td> 
 
         </tr> 
 
        </table></div>`, 
 
     controller: function($scope){ 
 
      $scope.levels = [1,2]; 
 
      $scope.lanes= [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15]; 
 
     }, 
 
     link: function(scope,elem,attr){ 
 
      console.log(scope.$last); 
 
      console.log(attr.check); 
 
     } 
 
    } 
 
})

.routeTable table tr td{ 
 
    border: 1px solid #000000 !important; 
 
    height:30px; 
 
    background-color:#CACDD0; 
 
    width:30px; 
 
} 
 
.routeTable{ 
 
    padding:10px; 
 
    width:500px; 
 
}

<!doctype html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Document</title> 
 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="style.css"> 
 
</head> 
 

 
<body> 
 
    <track></track> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
 
    <script src="track.js"></script> 
 
</body> 
 

 
</html>

答

我想你是误会什么。 scope变量传递只能在指令的同一个标记中起作用。在下面的例子中，我定义了一个新的指令d1，其中check属性将被正确地传递给它。

angular.module('myApp',[]) 
 
.directive('track',function(){ 
 
    return{ 
 
     restrict:'E', 
 
     
 
     template:`<div class="routeTable"><table class="table" id="road"> 
 
        <tr ng-repeat="level in levels"> 
 
         <td ng-repeat="lane in lanes" d1 check = "$index"></td> 
 
         </tr> 
 
        </table></div>`, 
 
     controller: function($scope){ 
 
      $scope.levels = [1,2]; 
 
      $scope.lanes= [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15]; 
 
     } 
 
    } 
 
}) 
 

 
.directive('d1', function(){ 
 
    return { 
 
     scope: { check : "="}, 
 
     link: function(scope,elem,attr){ 
 
      console.log(scope.check); 
 
     } 
 
    } 
 
})

.routeTable table tr td{ 
 
    border: 1px solid #000000 !important; 
 
    height:30px; 
 
    background-color:#CACDD0; 
 
    width:30px; 
 
} 
 
.routeTable{ 
 
    padding:10px; 
 
    width:500px; 
 
}

<!doctype html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Document</title> 
 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="style.css"> 
 
</head> 
 

 
<body> 
 
    <track></track> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
 
    <script src="track.js"></script> 
 
</body> 
 

 
</html>

谢谢。一个问题：制作新指令是获得“检查”价值的唯一途径？ –

不，但我不确定您的用例如何无法提供建议。你现在的例子只是使用$ index，你可以通过循环遍历数组来获得它，所以做一个指令来获取值是非常微不足道的。 – Icycool

无法获取隔离范围的值

相关推荐