Question

我正在尝试编写一个指令来提供表格格式。这个想法是用户传递指令对象列表（arr="ctrl.list"）和每个对象的名称（elem="obj"），并为每个表元素提供转换格式...

<div ng-controller="Test as ctrl">
    <test-repeat arr="ctrl.list" elem="obj">
    the element: {{obj}}
    </test-repeat>    
</div>

这是指令......

angular
    .module('myApp')
    .directive('testRepeat', function() {
    return {
        template: 
            '<div ng-repeat="elem in arr"><span ng-transclude></span></div>',
        transclude: true,
        restrict: 'AE',
        scope: {
            arr: '=',
            elem: '='
        },
        link: function($scope, $elem, $attr) {
        }
    };    
});

控制器：

angular
    .module('myApp')
    .controller('Test', function() {    
        var self = this;
        self.list = [ {title: 'one'}, {title: 'two'}, {title: 'three'} ];
});

虽然数组值（arr="ctrl.list"）已正确绑定到指令范围并由ng-repeat使用，但elem值不是，可能因为这两个变量的处理方式非常不同， ng-repeat指令。

是否可以重写此指令以使ng-repeat代码使用用户指定的elem值（即obj）？如果我需要使用ng-repeat函数编写我自己的transclude版本（作为参数传递给link函数），我将如何看待数组的每个元素，如{{1做什么？

这是jsfiddle的link。

修改

根据要求，所需的输出将是......

ng-repeat

使用上面显示的html示例（即the element: {"title":"one"} the element: {"title":"two"} the element: {"title":"three"}）。更广泛的想法是用户可以自定义他们想要显示the element: {{obj}}的方式。

如何在transcluded html中设置ngRepeat元素名称

0 个答案: