Question

当我使用ngTransclude时，页面似乎很好，但出现了控制台错误：

在模板中非法使用ngTransclude指令！没有找到需要转换的父指令。元素：{0}

我找到了根本原因：在index.js中我用$ compile来编译模态指令。似乎$ compile不能用于ng-transclude。你有什么建议来解决这个问题吗？

这是代码

directive.js：

myApp.directive('modal', function () {
    return {
        restrict: 'E',
        templateUrl: 'modal/modal.html',
        replace: true,
        transclude: true,
        scope: {},
        link: function(scope, element, attrs){

        },
        controller: ['$scope', function transcludeController($scope) {

        }]
    }
});

template.html：

<div class="modal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header"> ... </div>
            <div class="modal-body">
                <ng-transclude></ng-transclude>
            </div>
            <div class="modal-footer"> ... </div>
        </div>
    </div>
</div>

的index.html：

<modal>
<input type="text" id="test"/>
</modal>

index.js：

$scope.test = 'test';
$("#test").attr("ng-model", "test");
$compile(modal)($scope);

Answer 1

请检查Plunker链接。它在那里工作。如果您可以使用您的代码更新链接，我们可以帮助您。

Link: https://plnkr.co/edit/ey1fXDwEOVtA64R6Io3q?p=preview

在模板中非法使用ng-Transclude指令

1 个答案: