Question

这是我的测试指令的代码：

    mymodule.directive("test", function($compile) {
return {
    restrict: 'E',
    replace: true,
    template:
            '<div data-date="{{avail}}"></div>',
    scope: {
        avail: '='
    },
    controller: function($scope) {
        $scope.dump = function(el) {
            console.log($('<div>').append(el.clone()).html());
        };
    },
    link: function postLink($scope, $element, $attrs) {            

        $scope.dump($element); // print '<div data-date="{{avail}}"></div>'
        $scope.dump($compile($element)($scope));  // print '<div data-date="{{avail}}"></div>'

        setTimeout(function() {
            $scope.dump($element); // print '<div data-date="12.10.2014"></div>'
        }, 1);
    }
}
});

问题是：我如何编译（或如何命名）字符串

<div data-date="12.10.2014"></div>

postLink函数中的

（不使用setTimeout）。

Answer 1

这非常像@Ben回答，只有你应该取消注册$ watch listener

var unregister = $scope.$watch('avail', function(){
   if($scope.avail) {
       $scope.dump($element);
       unregister();
   }
});

或者你可以使用$ timeout

$timeout(function(){
    $scope.dump($element);
})

Answer 2

您可以使用：

var runOnce = false;

$scope.$watch('avail', function(){
  if($scope.avail && runOnce == false){
    $scope.dump($element);
    runOnce = true;
  }
});

您遇到的问题是在通过链接属性传入范围值之前调用链接函数。通过添加监视，您可以在设置值时触发您想要运行的功能 - runOnce标志确保此代码仅运行一次。设置超时不太可靠，因为您无法确切地确定要调用的链接函数与设置的范围值之间经过了多少毫秒。

我如何在angularjs指令中获得编译（？）字符串

2 个答案: