$ compile返回對象中的html

Question

所以我調用了一個html模板，想用角度綁定數據，所以我得到要綁定的數據，我得到了html，當我嘗試編譯時，它將返回所有綁定的html，但是在（我認為）對象中，可以我這樣做使其成為html。

這是代碼

$.get("file.html", function(partial){

        var scope = $rootScope.$new();
        scope.data = result;

        var el = angular.element(partial);

        var compiled = $compile(el)(scope);
        var finalHtml = el[0];


        $timeout(function(){
            var calendar = window.open();
            calendar.document.write(finalHtml);
            calendar.focus();
            calendar.print();
        });
    });

我已經嘗試過.html .toString String（）無效

先感謝您

Answer 1

您的已compiled變量是可以插入文檔中的有角jQuery或jqlite元素。 如果要為其獲取html，則可以在基礎節點上使用outerHTML HTML屬性（通過獲取第一個已compiled[0]數組元素compiled[0]獲得基礎節點）-https: //developer.mozilla.org/en -US / docs / Web / API / Element / outerHTML

var compiled = $compile(el)(scope);
// scope.$digest() // only call if not within an angular $digest already
$timeout(function() {
  var finalHtml = compiled[0].outerHTML;
  ...
}

根據文檔“鏈接后，只有在調用$ digest之后，視圖才會更新，這通常是由Angular自動完成的。” 因此，您必須手動調用scope.$digest()或實際上使用angular API使用$http或最好使用$templateRequest來執行請求，例如@ThinkingMedia建議。 在有角$ digest運行之后，您可以訪問更新的視圖。

我在這里創建了一個插件，展示了如何僅使用AngularJS api正常運行： http ://plnkr.co/edit/rFcfgB3FWhsfyySfr0rU?p=preview

我還更改了打開彈出窗口的方式，以應對執行彈出窗口的安全隱患。