小编use*_*127的帖子

如何在Angular JS中的指令模板中使用"ng-repeat"?

我是Angular JS的新手,我正在尝试创建一个将使用如下的自定义指令:

<div linkedlist listcolumns="{{cashAccountsColumns}}"></div>

Corrps.控制器将是:

$scope.cashAccountsColumns = [
  {"field": "description", "title": "Description"},
  {"field": "owner", "title":"Owner"},
  {"field": "currentBalance", "title":"Current Balance" }
];
Run Code Online (Sandbox Code Playgroud)

指令代码是:

return {
      restrict : 'EA',
      transclude : false,
      templateUrl : 'html/linkedlist.html',
      scope: {
         listcolumns: "@"
      },
      link : function(scope, element, attrs) {
      }
}
Run Code Online (Sandbox Code Playgroud)

模板是:

<table class="box-table" width="100%">
  <thead>
    <tr>
      <th scope="col" ng-repeat="column in listcolumns">
        {{column.title}}
      </th>
    </tr>
  </thead>
</table>
Run Code Online (Sandbox Code Playgroud)

但这不起作用.我没有在屏幕上获得column.title的值,而是将以下太多行添加到DOM:

<th ng-repeat="column in listcolumns" scope="col" class="ng-scope ng-binding"></th>
Run Code Online (Sandbox Code Playgroud)

angularjs angularjs-directive angularjs-ng-repeat

50
推荐指数
1
解决办法
6万
查看次数