2014-11-20 32 views
0

我有一個指令可以在其中包含一些HTML。我怎麼才能得到它?我已經嘗試鏈接和編譯,但我正在獲取模板中定義的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而不是從我的指令模板?

編輯:下面是一個例子 - http://plnkr.co/edit/z6gFOrGG01jKoKwISHcW?p=preview

+0

試圖用等的console.log(element.find( 'P'));在鏈接塊 – Whisher 2014-11-20 19:56:24

+0

不起作用,仍然返回我不想要的HTML。 – gwin003 2014-11-20 20:11:29

+0

https://gist.github.com/whisher/3733e1f67e63c798952a它的工作原理console.log打印這是我想要的HTML! – Whisher 2014-11-20 20:20:21

回答

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];