刪除TR，如果它沒有孩子 - ng-repeat - angular

我想在使用ng-repeat的表格內部構建tr，並且基於某些使用row作爲值的邏輯構建它。這是介紹空tr的我如何刪除它？刪除TR，如果它沒有孩子 - ng-repeat - angular

此代碼在tbody結尾添加2個空tr。

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

app.controller('MainCtrl', function($scope) { 

$scope.data = [ 
{ 
    "name" : "John", 
    "row" : 1 
}, 
{ 
    "name" : "Mike", 
    "row" : 2 
}, 
{ 
    "name" : "Bill", 
    "row" : 1 
}, 
{ 
    "name" : "Alice", 
    "row" : 3 
}, 
{ 
    "name" : "David", 
    "row" : 2 
} 
] 
}); 



app.directive('specrow', ['$compile', function($compile) { 
return { 
    restrict: 'A', 
    scope : { 
     'specobj' : '=', 
     'specitemindex' : '=' 
    }, 
    link: function (scope, elem, attrs){ 
     var template = "<td><span>{{specobj.name}}</span></td>"; 
     var linkFn = $compile(template); 
     var content = linkFn(scope); 
     var trEl = angular.element(elem[0].parentElement.children).eq(scope.specobj.row-1); 
     if(trEl.length === 0) { 
      elem.append(content); 
     }else{ 
      angular.element(elem[0].parentElement.children).eq(scope.specobj.row-1).append(content); 
     } 
    } 
    } 
}]);

Plnkr：http://plnkr.co/edit/I3kl9U41n3VzQvqFfG4G?p=preview

來源

2014-09-25 user1184100

你到底想達到什麼目的？ 2列布局？除非我不明白你想要什麼，否則你在做什麼是完全錯誤的。 – 2014-09-25 09:48:46

我正試圖建立基於行位置的表。例如'約翰'和'比爾'必須在相同的tr，因爲他們有相同的行位置1. – user1184100 2014-09-25 09:50:46

現在我明白了。我會創建完整的評論。 – 2014-09-25 09:56:56

所以有答案:)

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

 
app.controller('MainCtrl', function($scope) { 
 
    $scope.name = 'World'; 
 
    $scope.data = [ 
 
    { 
 
     "name" : "John", 
 
     "row" : 1 
 
    }, 
 
    { 
 
     "name" : "Mike", 
 
     "row" : 2 
 
    }, 
 
    { 
 
     "name" : "Bill", 
 
     "row" : 1 
 
    }, 
 
    { 
 
     "name" : "Alice", 
 
     "row" : 3 
 
    }, 
 
    { 
 
     "name" : "David", 
 
     "row" : 2 
 
    } 
 
    ] 
 
});

table, th, td { 
 
    border: 1px solid black; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.1.1/angular-filter.min.js"></script> 
 

 
<body ng-app="app"> 
 
    <table ng-controller="MainCtrl"> 
 
     <tbody> 
 
      <tr ng-repeat="row in data |groupBy: 'row' | orderBy : 'row'"> 
 
      <td ng-repeat="person in row">{{person.row}}.{{person.name}}</td> 
 
       
 
      </tr> 
 
     </tbody> 
 
    </table> 
 
    </body>

來源

2014-09-25 10:06:27 sylwester

刪除TR，如果它沒有孩子 - ng-repeat - angular

回答

相關問題