Question

我是角度js的新手并且正在探索自定义指令。我创建了一个指令并将其命名为datatable。以下是代码：

angular.module('myApp.directives', []).directive('datatable', function(){
    return{
        restrict: 'E',
        scope:{
            friends: '='
        },
        template : 'Hey{{friends[0].firstName}} : {{friends[0].lastName}}',
        controller :function($scope)
        {
            $scope.friends =[{"firstName" : "ABC", "lastName" : "XYZ"}];
        }
    }
});

此代码工作正常，但是当我尝试使用ng-repeat遍历友元数组时，它不会打印任何内容。我正在替换模板如下：

template : '<li ng-repeat ="friend in friends"> Hey{{friend.firstName}} : {{friend.lastName}}</li>'

我也想知道我是否在模板中使用任何HTML元素，例如：

template : '<h1>Hey{{friends[0].firstName}} : {{friends[0].lastName}}<h1>',

也没用。

我做错了什么？

Answer 1

模板应该只有1个根元素，试试这个：

template : '<ul><li ng-repeat ="friend in friends"> Hey{{friend.firstName}} : {{friend.lastName}}</li></ul>'

指令模板内的HTML元素

1 个答案: