爲什麼我不能在ng-click調用（AngularJS）上使用jQuery語句？

試圖瞭解爲什麼當我試圖建立一個使用jQuery函數的方法的ng-click調用時，我得到undefined。下面是它的一個例子：爲什麼我不能在ng-click調用（AngularJS）上使用jQuery語句？

<a href="#" class="btn btn-default" ng-click="angularMethod($('input[name=__RequestVerificationToken]').val())">...</a>

的NG-控制器我有：

$scope.angularMethod = function(token) { 
    $log.debug(token); 
}

這使得我在控制檯上undefined消息。

我有一個完整的jQuery js文件在角度js文件之前加載。這不應該是工作？

來源

2015-05-13 Marcelo Myara

你打算通過這樣做是爲了達到什麼樣的？你爲什麼不把'ng-model'分配給它 –

你爲什麼需要這樣做？你不能的原因是'$'不是角度範圍的一部分 – charlietfl

假設我不能。示例中的輸入由ASP.NET MVC助手呈現，我幾乎無法控制它。我coulb建立我的幫助器上提供一個ng模型的輸入，但這是我不舒服的做法。此外，我可以想象使用像上面這樣的systax的大量用法（並且儘可能地將視圖從控制器中分離出來）。 –

我有一個完整的jQuery js文件被加載到角度js文件之前。這不是應該工作嗎？

不，ngClick和類似指令不是onclick等屬性。這只是一些自定義屬性，其中一些字符串值由Angular解析和評估（如果您有興趣，請參見parse.js）。您可以提供的那些表達式在當前作用域對象的上下文中進行評估。

所以，現在你應該能夠理解爲什麼它不會在你的情況下工作。你有範圍屬性$這基本上是指向jQuery？我猜不會。從技術上講，可以讓你的例子工作，但是你不應該像這樣混合使用jQuery和Angular。它會讓你的代碼非常難以閱讀和支持。

同時檢查這個很好的問題「Thinking in AngularJS」 if I have a jQuery background?關於在jQuery中正確使用Angular。

來源

2015-05-13 13:48:43 dfsq

好吧，我明白了。在這種情況下，我可以使用常規的onclick，將其附加到常規JS方法，然後使用該標記填充範圍屬性並從那裏調用範圍方法。這將是awfull（我現在得到了），但它會工作，對不對？ –

是的，你可以用'onclick'完成：設置必要的範圍值，觸發範圍摘要。但它很快就會變得難以維繫。 – dfsq

@MarceloMyara no ...徹底擺脫頁面中的jQuery，並且不要將MVC視爲驅動你的頁面。 *首先考慮數據* ...然後將視圖和視圖綁定到範圍數據模型，首先使用角度內置指令......並根據需要定製數據模型 – charlietfl

檢查爲你展現不同的解決方案，您可以用angularjs使用製備此琴從來就：

http://jsfiddle.net/joshdmiller/HB7LU/

<div ng-controller="MyCtrl"> 
<input name="__RequestVerificationToken" ng-model="myvalue"> 
<a href="#" class="btn btn-default" ng-click="angularMethod(); angularMethodTWO()" ng-model="myvalue">CLICK</a> 
</div> 




var myApp = angular.module('myApp', []); 

function MyCtrl($scope) { 
$scope.name = 'Superhero'; 

$scope.angularMethod = function() { 
    alert("WITH NG-MODEL:" + $scope.myvalue); 
} 

$scope.angularMethodTWO = function() { 
    alert("WITH ANGULAR ELEMENT:" + angular.element(document.querySelectorAll("[name=\'__RequestVerificationToken\']")).val()); 
} 
}

希望它幫助！

編輯改變的jsfiddle網址的新版本（另一次是不正確的）

來源

2015-05-13 14:12:53

不會傷害顯示模型的價值作爲文本或OP看到實時頁面更新 – charlietfl

很好。我將添加文檔值以顯示 –

這不起作用。我忘了在那個模塊上註冊控制器...但無論如何，我明白了。問題是：我無法控制__RequestVerificationToken的輸入（所以我不能在其上添加ng-model指令）。這是挑戰... –

爲什麼我不能在ng-click調用（AngularJS）上使用jQuery語句？

回答

相關問題