使用webmethod在angular中單擊輸入按鈕時如何保持綁定

Question

我正在嘗試使用已知的可運行網絡方法（.net）更新我的角度模型。

• 我從Web方法獲取的數據成功登錄到控制台。

• 它還會更新輸入框的值。

• 但這不會更新我的角度模型綁定。

我究竟做錯了什么？

HTML

 <input class="btn-primary" />
 <input class="txtCalls" ng-model="TotalCalls"/>

角

$scope.TotalCalls;

代碼隱藏

    [WebMethod]
    [ScriptMethod(UseHttpGet = true)]
    public static string GetCallData()
    {
         String Calls = "34";
         return Calls;
    }

阿賈克斯電話

$(document).ready(function () {
            $('.btn-primary').click(function () {
                $.ajax({
                    type: "GET",
                    url: "Stats.aspx/GetCallData",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        $('.txtCalls').text(response.d);
                        console.log(response.d);
                    },

                    failure: function (response) {
                        alert(response.d);
                        console.log(response.d);
                    }
                });
             });

Answer 1

這是因為這是JQUERY / Ajax調用，而不是角度調用。 您需要從角度控制器進行調用，並使用$http.get而不是$.ajax

您的按鈕.btn-primary應該添加一個ng-click="someMethod()"而不是JQuery on('click') 。 喜歡：

<input class="btn-primary" ng-click="someMethod() />

我假設您已經有一個控制器，因此您將需要實現someMethod例如：

$scope.someMethod = function(){  $http.get(...) };  

另外，angular是MVVM框架，作為此模式的一部分，您更新Model（data）而不是html>form>input控件視圖，兩種方式的綁定將為您完成其余工作。

Answer 2

如果從“外部”角度更改值，則需要引用角度scope ，然后調用scope.$apply() 。

例如：

var el = $('.txtCalls').get(0);
angular.element(el).scope().$apply();

但是通常，如果可能的話，最好使用角度提供的代碼/過程（例如$http.get ）

Answer 3

在angularJS控制器或服務或指令中使用angularJS $ http.post代替$ .ajax。