如何通过函数更新$ scope变量

Question

我目前正在努力从端点获取一些数据，然后更新一个名为$scope.response的变量。 我不太确定如何更新此变量并将其呈现在屏幕上。 那么下面的代码中发生了什么：我从iframe的src属性获取查询字符串，然后将其发布到我的端点，在那里我得到了一个名为data的特定响应。 我想用此对象更新$scope.response ，然后使用{{response}}在视图上呈现它。

有人可以告诉我我该怎么做吗？

app.controller('MainCtrl', function($scope) {

  $scope.response;

  API = {};
  API.endpoint = 'https://some/endpoint/';


  function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
      results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
  }

  function doAjax(callback) {
    var q = getParameterByName('QUERY');
    jQuery.ajax({
      url: API.endpoint + "script.php",
      method: "POST",
      data: { q: q },
      dataType: "json",
      success: function (data) {
        callback(data);
        $scope.response = data;
      }
    });
  }

});

Answer 1

Angular并不神奇地知道对象上的属性何时更改，它必须一直不停地重新检查所有对象以捕获此类更改。 当您使用任何Angular服务或事件时，Angular看起来就好像注意到了这些更改，因为这些触发了摘要周期 。 在摘要周期结束时，Angular检查它知道的对象是否有更改，并传播这些更改（例如，更新视图等）。

当您使用jQuery时，这就是Angular所不了解的东西。 首先，您不应使用jQuery，而应使用Angular的$http服务来发出任何网络请求，因为Angular随后将正确地循环其消化系统。*

_{*双关语意}

如果您必须使用某些非Angular系统（再一次，您根本不必在这里），那么您需要触发另一个摘要周期。 最好的方法是使用$timeout服务：

app.controller('MainCtrl', function($scope, $timeout) {

  ...

        success: function (data) {
          callback(data);
          $timeout(() => $scope.response = data);
        }

  ...

});

Answer 2

为什么在Angular中使用jQuery？ 如果选择“ Angular”，则应使用“ $ http”作为“ angular”。 删除功能doAjax并将其替换为$ http。 您可以在这里https://docs.angularjs.org/api/ng/service/$http阅读文档