2016-07-24 4 views
3

tbodyでng-repeatを使用する際に問題があります。私はそのコードを使用すると :同じスコープは、完璧な作品の中にアンビエントの反復は動作しません

<div ng-repeat="group in groups">{{group.name}}</div> 

TypeError: Cannot read property 'childNodes' of undefined

しかし、このコードを持つ:

<tbody> 
    <tr ng-repeat="group in groups"> 
     <td>{{ group.name }}</td> 
    </tr> 
</tbody> 

を私はこのエラーを取得します。私はtbodyでng-repeatを使う答えを見つけましたが、jqueryのデータ型を使うためにはこの構造が必要です。誰も私にこれを助けることができますか?

+1

あなたはエラーのjsfiddleを提供できますか? –

+0

は正直で何か本当にばかげているようです。あなたが間違っている可能性がある場所を確認するコードをもう少し与えてください。このplunkを見てください(https://plnkr.co/edit/KcZiBiY4s9TPASYIg0eB) – Alok

+0

申し訳ありませんが、私はどのようにこのようなフィドルのようなものを使用するのか分かりません。ここにコードがあります:https://plnkr.co/edit/nDRj7T9Cy5hugqQLEhM3?p=catalogue –

答えて

2

そのあなたが "のことを確認し、 "グループ" は、あなたのスコープアレイ名である場合

を "group.name" にアクセスしようとしている

var app = angular.module('plunker', []); 
 

 
app.controller('MainCtrl', function($scope) { 
 
    $scope.groups = [ 
 
     {name: 'Michał', users: 5, owners: 4}, 
 
     {name: 'Michał', users: 5, owners: 4}, 
 
     {name: 'Michał', users: 5, owners: 4}, 
 
     {name: 'Michał', users: 5, owners: 4} 
 
    ]; 
 
});
<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <meta charset="utf-8" /> 
 
    <title>AngularJS Plunker</title> 
 
    <script>document.write('<base href="' + document.location + '" />');</script> 
 
    <link href="style.css" rel="stylesheet" /> 
 
    <script data-semver="1.4.9" src="https://code.angularjs.org/1.4.9/angular.js" data-require="[email protected]"></script> 
 
    <script src="app.js"></script> 
 
    </head> 
 

 
    <body ng-app="plunker" ng-controller="MainCtrl"> 
 
    using div 
 
    <div ng-repeat="group in groups">{{group.name}}</div> 
 
    using table 
 
    <table> 
 
    <tbody> 
 
    <thead> 
 
         <tr> 
 
          <th>name</th> 
 
          <th>user</th> 
 
          
 
         </tr> 
 
        </thead> 
 
<tr ng-repeat="group in groups"> 
 
     <td>{{ group.name }}</td> 
 
     <td>{{ group.users }}</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
    </body> 
 

 
</html>

+0

私は静的コントローラを使用できません。私はマルチビューのためにng-viewを使うので、この方法ではうまくいきません。 –

0

を作業、次のように試してみてください名前はあなたの配列要素です。 エラーが表示されているので、配列要素の名前がアクセスしようとしているものと同じではないと推測します。 例:

app.js:

var app = angular.module('testing', []); 

app.controller('mainctrl', function($scope) { 
$scope.groups = [ 
{name: 'Apple'}, 
{name: 'Orange'}, 
{name: 'Banana'} 
]; 
}); 

index.htmlを

<!DOCTYPE html> 
<html ng-app="testing"> 
<head> 
<meta charset="utf-8" /> 
<title>Testing</title> 
<link rel="stylesheet" href="style.css" /> 
<script data-require="[email protected]" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script> 
<script src="app.js"></script> 
</head> 
<body ng-controller="mainctrl"> 
<table> 
    <tr ng-repeat='group in groups'> 
    <td>{{group.name}}</td> 
    </tr> 
    </table> 
    </body> 
    </html> 

はそれが助けを願っています。 :)

関連する問題