Question

我试图在表格中使用角度指令，但我没有看到任何数据，当我使用列表时，我可以看到数据并且它可以正常工作。我也使用bootstrap为表格设置样式。我真的不知道自己做错了什么，

希望您能提供帮助，以下是我的代码的主要部分：

main.html中：

  <table class="table">
    <thead>
        <tr>
            <th>First Name</th>
            <th>Last Name</th>
            <th>Username</th>
        </tr>
    </thead>
    <tbody ng-repeat="m in users">

        <my-dir my-obj="m"></my-dir>

    </tbody>
</table>

app.js：

＆＃13;

var myApp = angular.module('myApp', ['ngRoute'])

myApp.config(function($routeProvider) {

    $routeProvider
        .when('/', {
        templateUrl: 'pages/main.html',
        controller: 'AppCtrl'
    })
 

});

myApp.controller('AppCtrl', function($scope) {
    

    $scope.users = [{name: 'john', age: 16}, {name: 'dani', age: 10}];
    
    
    
});

myApp.directive('myDir', function(){
    return{
        templateUrl: 'directive/mytbl.html',
        replace: false,
        scope:{
            myObj: '='
        }
    }
})

＆＃13;

mytbl.html：

<td>{{ myObj.name }}</td>
<td>{{ myObj.age }}</td>

Answer 1

您正在为每个用户创建<tbody>。

尝试更改为：

<tbody>
   <tr ng-repeat="m in users" my-dir my-obj="m"></tr>
</tbody>

该指令实质上是将它的模板附加到指定它的元素（创建该元素的子元素）。所以在这种情况下，孩子们就是那些孩子。

带表的angular指令

1 个答案: