AngularJS指令控制器操縱DOM

Question

開發人員指南說，在指令內指定的控制器在預鏈接函數之前被實例化，並且在預鏈接函數中進行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的討論中

謝謝

Answer 1

看起來傳遞給$ transclude的函數在鏈接階段執行： https ： //github.com/angular/angular.js/blob/v1.1.5/src/ng/compile.js#L471

編輯 ：我將GH引用更改為標記版本，以便對我引用的代碼沒有歧義。