Question

我的模板具有以下结构（address-contact-info.html）：

<dd ng-repeat="contact in contactInfo | limitTo: displayedItems | orderBy:'desc'">
    <span ng-transclude></span>
</dd>

指令：

{
    templateUrl: 'address-contact-info.html',
    restrict: 'A',
    scope: {
        contactInfo: '='
    },
    transclude: true,
    link: function (scope, elem, attrs, ctrl, transclude) {
        scope.displayedItems = 1;
    }
};

我想使用这样的指令：

<div address-contact-info contact-info="tel">
    <span>{{contact.number}}</span>
</div>

这意味着我想要在我的被转换元素中访问ng-repeat范围，但我不知道该怎么做。

您是否知道如何实现这一目标，还是有更好的方法来实现这一目标？

感谢您的帮助！

更新这是一个掠夺者：http://plnkr.co/edit/4DYEUhHAPuJOLyG9omCT

更新

我找到了一个适合我的解决方案，但我还有一个问题。我想在模板中转换的元素有自己的指令，需要父指令。

现在当我在linkFn中调用transcludeFn时，我收到以下错误：

Error: [$compile:ctreq] Controller 'editableGroup', required by directive 'editable', can't be found!

http://plnkr.co/edit/zriVyS7MzheSI8jcYM5d

在这个plunker中我没有包含其他指令，但我也得到了transcludeFb相关的错误。

Cannot set property 'nodeValue' of undefined

Answer 1

<div address-contact-info contact-info="tel">
    <span>{{contact.number}}</span>
</div>

此代码段将使用控制器的范围进行编译，该控制器没有对联系人的引用。因此，ng-repeat不能显示任何数据。

即使是已转换的内容也将使用控制器的范围进行编译。不符合指令的范围。

对此的黑客攻击是： http://plnkr.co/edit/clrchL1HLtFQLZ4fctZx?p=preview

这可能不是正确/正确的解决方案。

AngularJS：将ng-repeat范围暴露给ng-transclude

1 个答案: