2014-07-25 63 views
0

我一直在移動應用程序中使用JQuery和Angular的混合。偶爾會遇到一個非常奇怪的錯誤。JQuery AJAX請求如何觸發Angular ng-click指令

與角指令的元素是在被使用ng-include指令包括一個局部:

<ng-include src="'../partials/_childnav.html'" autoscroll=""></ng-include> 

和部分有幾個導航組件:

<div class="nav-home" ng-click="navHome()"></div> 
<div class="nav-back" ng-click="navBack()"></div> 

這些div是不在代碼中的任何地方引用(這些類僅用於樣式),而函數只能從這些指令中調用:因此對於要調用的這些函數,應該是唯一的方法。

在我的搜索頁面上,我使用簡單的$.ajax()調用來獲取預設查詢的一些結果。這是在頁面的可見性更改事件上完成的,其結果用於對$scope進行很多更改。通常一切都按預期工作,但並非總是如此。

我遇到的錯誤是隨機的(但只有當AJAX請求非常快速完成時),這些導航組件上的ng-click指令似乎纔會被調用。

爲了給它增加更多奇怪的東西,當這個錯誤發生時,它似乎在尋找要按下的按鈕。正因爲如此,navHome()通常最終被調用,但如果我刪除指令:

<div class="nav-home"></div> 
<div class="nav-back" ng-click="navBack()"></div> 

然後navBack()被調用。如果我刪除了這兩個,該錯誤不會發生(顯然這不是一個解決方案)。

編輯:使用點擊處理程序而不是ng-click指令會產生相同的結果,所以有些東西會觸發div上的點擊事件。

我很想得到一個如何實際發生的解釋,這種行爲對我來說簡直荒謬。

+0

你的ajax調用(成功和錯誤)的回調是什麼? –

+0

您是否嘗試在代碼中設置斷點並查看調用堆棧以找出調用這些方法的內容? – Edminsson

+3

混合jQuery和Angular會產生一些非常奇怪的結果 - Angular需要運行'$ digest'循環來將視圖綁定回模型--jQuery的'.ajax'不會觸發一個循環,因此必須手動觸發。如果你在'$ .ajax'中追加HTML,那麼HTML必須被編譯爲'$ scope',否則Angular方法將不可訪問。 – tymeJV

回答

0

原來這是開發環境(AppGyver Steroids)的問題。我可以通過使用它們的構建和JS庫版本的某些組合來解決它,但是該錯誤位於封閉的源代碼中,並且開發人員並不在意調查,因此無法解決此問題。