2013-05-27 27 views
0

我正在一個大型的企業應用程序,我們的應用程序使用jQuery,我們想集中使用角度,我們不能立即刪除所有的jQuery代碼,因此我們必須處理已經存在於系統中的東西。其中一個是從使用的角度阻止我們最常見的事情是下面的代碼使角度看jQuery創建的內容

$.ajax('/HtmlController', {...}).then(function(html) { 
    $('someElement').replaceWith(html); 
}); 

我們無法刪除它現在的存在,因爲它會打破系統的東西。相反,我們希望一步一步地平穩過渡。我們需要做的第一步是在返回的html中應用angular綁定,並用jQuery替換。換句話說,我們需要把下面的標記到html變量

... 
1 + 2 = {{ 1 + 2 }} 
... 

我們需要它來獲得由角執行,可惜角度沒有看到新注入的HTML,怎麼可能做出的角度看它?

+0

嘗試使用'$( 'someElement').replaceWith($插值(HTML)($範圍));'不要忘記使用依賴注入來添加'$ interpolate'。 – Cybrix

+0

我無法更改replaceWith代碼,此更改將反映在超過100個對話框中,這些對話框可能具有自定義JavaScript,並且具有很多HTML結構的依賴關係,因此我需要以某種方式插入現有的HTML。以某種方式完成是否可能? – Lu4

+0

嗯,我對AngularJS很新,但是,如果'someElement'在一個控制器中,你可能想用'$ timeout'來檢查它的html是否使用'var value = $('[ng-controller =「你的控制器「]')。html()'並調用'value = $ interpolate(value)({})'。或者你可能會覆蓋'$ .fn.replaceWith',但是我不確定你是怎麼做到的,在其中執行Angular的代碼。 – Cybrix

回答

0

您將不得不編譯該元素並將其與範圍鏈接。假設你有一個角頁,像這樣的工作:

$.ajax('/HtmlController', {...}).then(function(html) { 
    var dom = $('someElement'); 
    var el = angular.element(dom), scope = el.scope(), 
     $compile = el.injector().get('$compile'); 

    scope.$apply(function(){ 
    dom.replaceWith($compile($(html))(scope)); 
    }); 
}); 

下面是一個簡單的例子:http://plnkr.co/edit/mRhsZV5DahfCjMWkP2My?p=preview