在指令声明中获取HTML

时间:2014-11-20 19:39:02

标签: angularjs angularjs-directive

我有一个可以在其中包含一些HTML的指令。我怎么才能得到它?我尝试过链接和编译,但我得到了模板中定义的HTML。以下是我的观点:

<my-directive ng-model="ctrl.SomeField">
   <p> This is the HTML I want! <p>
</my-directive>

这是我的指示:

return {
  restrict: 'E',
  scope: {
    ngModel: "="
  },
  template: "<p>This is the HTML that is being returned from compile and link!</p>" + 
            "<p>This is not the HTML that I want!</p>"
  link: {
    pre: function preLink(scope, element, attrs) {
      var html = element.html();  //returns the html in the directive template
    },
    post: function postLink(scope, element, attrs) {
      var html = element.html();  //returns the html in the directive template
    }
  },
  compile: function(element, attrs){
      var html = element.html();  //returns the html in the directive template
  }
}

如何从我的视图中获取HTML而不是从我的指令模板中获取HTML?

编辑:以下是一个示例 - http://plnkr.co/edit/z6gFOrGG01jKoKwISHcW?p=preview

1 个答案:

答案 0 :(得分:0)

这是我的解决方案! http://plnkr.co/edit/OlRyBN1I0jCkAREIKVeC?p=preview。基本上我只需要使用另一个指令在链接步骤中做一些奇特的翻译。

这是指令:

function returnFn() {
    return {
        link: {
            pre: function (scope, element, attr, ctrl, transclude) {
                if (transclude) {
                    transclude(scope, function (clone) {
                        element.append(clone);
                    });
                }
            }
        }
    }
}

return [returnFn];