3

开发人员指南说，在指令中指定的控制器在预链接函数之前实例化，并且在预链接函数中进行 DOM 操作是不安全的。

那么为什么控制器将其作为它的第三个参数 $transclude 进行 DOM 操作，如下例所示：

testapp.directive('buttonBar', function() {
    return {
        restrict: 'EA',
        template: '<div class="span4 well clearfix"><div class="primary-block pull-right"></div><div class="secondary-block"></div></div>',
        replace: true,
        transclude: true,
        scope: {},
        controller: ['$scope', '$element', '$transclude', function ($scope, $element, $transclude) {
            $transclude(function(clone) {
                var primaryBlock = $element.find('div.primary-block');
                var secondaryBlock = $element.find('div.secondary-block');
                var transcludedButtons = clone.filter(':button'); 
                angular.forEach(transcludedButtons, function(e) {
                    if (angular.element(e).hasClass('primary')) {
                        primaryBlock.append(e);
                    } else if (angular.element(e).hasClass('secondary')) {
                        secondaryBlock.append(e);
                    }
                });
            });
        }],
    };
});

在来自http://blog.omkarpatil.com/2012/11/transclude-in-angularjs.html的讨论中

谢谢

4

1 回答 1

0

您传递给 $transclude 的函数似乎是在链接阶段执行的： https ://github.com/angular/angular.js/blob/v1.1.5/src/ng/compile.js#L471

已编辑：我将 GH 引用更改为标记版本，这样我引用的代码就不会模棱两可了。

于 2013-06-18T20:10:39.093 回答