隔離されたスコープの値を取得できません

隔離されたスコープ "チェック"の値を取得できません。テスト目的のために、私はインデックス値を "チェック"に渡します。 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>

出典

2017-10-11 Himanshu Shekhar

私はあなたが何かを誤解だと思います。 scope変数の受け渡しは、ディレクティブの同じタグ内でのみ機能します。以下の例では、check属性が正しく渡される新しい指示文d1を定義しました。

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>

出典

2017-10-11 10:57:54 Icycool

... もう一つ質問ありがとう：新しいディレクティブを作るが値を「チェック」を取得するための唯一の方法ですが？ –

いいえ、あなたのユースケースがわからないのでアドバイスできません。現在の例では、$ indexを使用しています。これは、配列自体をループすることで得ることができます。したがって、値を取得するための指示は非常に簡単です。 – Icycool

隔離されたスコープの値を取得できません

答えて

関連する問題