Question

我写了这样一个指令：

app.directive('headersort', function () {
    return {
        restrict: 'E',
        scope: {
            sortBy: '=',
            title: '='
        },
        template: '<th>{{ title }}</th>',
        replace: true,
        link: function (scope, element, attributes) { 
            scope.sortBy = attributes.sortBy;
            scope.title = attributes.title;

        }
    };
});

我这样使用它：

<headersort sortBy="Name" title="Product">

我想要的是<headersort sortBy="Name" title="Product">被<th>Product</th>取代。但我得到一个错误说：

Template must have exactly one root element. was: <th>{{ title }}</th>

但我确实有一个根元素，对吗？我的根元素是<th>，为什么角度抛出这个错误？根元素的条件/定义是什么？

Answer 1

查看this问题。

尝试将指令从restrict: 'E'更改为restrict: 'A'并将HTML更改为<th headersort sortBy="Name" title="Product"></th>

Answer 2

我认为它是关于table元素的说法。你有没有在某个地方定义它？

Angular中的根元素是什么？

2 个答案: