使用angularJS和jquery的$（'document'）的最佳方式。ready（）

Question

我有一大堆頁面給了我一個設計師，它必須與我現有的AngularJS項目集成。

我給出的頁面使用了很多jquery。導致問題的一件事是jquery的$('document').ready()函數。

由於在一個角度項目中，頁面只被加載一次，所以任何頁面中的大部分document.ready()部件都不起作用。每次頁面更改時，都會有一些代碼在這個函數中不起作用。

所以，在我的項目爲準控制器應該有一個工作對document.ready我把它扔在控制器任何像這樣的代碼：

setTimeout(function(){ 
$scope.$apply(function() { 
    var _wht=($(window).height()); 
    var _wwt=($(window).width()); 
    _wht=($(window).height()); 
    _wwt=($(window).width()); 
    if(_wht > 450){ 
     var mcht = _wht - ($('header').height()+ $('footer').height()+50); 
     $('.login-page').css('height',mcht+'px'); 
     $('.login-page').css('padding-top',((mcht - 158)/2) +'px'); 

    } 



    }); 
}); 

這工作得很好。

但我認爲這反對angularJS的關注點分離的哲學。控制器是你只有你的業務邏輯的地方。

哪裏是最好的地方扔這段代碼？

Answer 1

AngularJS在這裏是爲了強大的架構而建立的，這就是爲什麼我們在指令和其他組件方面看到如此多的模塊。將JQuery與它放在一起將會像脫離核心設計一樣，並且最終會導致維護代碼庫的混亂。

如果您正在編寫AngularJS應用程序，jQuery是一個柺杖。

如果你開始一個AngularJS應用程序，請仔細看看ng-boilerplate。然後看看ui-bootstrap’s directives。它們是你如何用一小部分代碼來完成「jQuery事物」的活生生的例子，並且構建一個易於維護，應用程序可測試性更強的應用程序，並且通常更好。

看看這個東西

• How do I 「think in AngularJS」 if I have a jQuery background? - 一個優秀的堆棧溢出後，關於這個觀點擴展了$('document').ready()

• Using AngularJS? Then stop using jQuery

相反，你也可以使用。

angular.element(document).ready(function() { 
    : 
    : 
});