Angular JS Controller - 范围问题（可能）答案

【问题标题】：Angular JS Controller - Scope issue (maybe)Angular JS Controller - 范围问题（可能）
【发布时间】：2016-03-09 19:26:56
【问题描述】：

我的 HTML 中有以下内容：

<body ng-controller = "Control as control">
<button ng-click = "control.prepareAction()">Do Action </button>
<div id="one" ng-hide = "!control.showOne" >
    <div>
      <h6> {{control.name}}</h6>
      <p> Bills Sponsored: {{control.count}} <p>
  </div>

</body>

在我的 Javascript 中：

var vm = this;
vm.name = "My Name"
vm.prepareAction = function(){
  action(parseFirst(), parseLast()); //The two parse functions simply get values from an HTML form. This works correctly.
}
function action(first, last) {

      $.post('php/one.php', {
          first: first,
          last: last
        },
        function(data) {
          create(JSON.parse(data));
        });
      return values;
      }

    function create(data) {
      var countArray = data[0];
      vm.count = countArray[0];
      vm.showOne = true;
    }

此函数不会更新 HTML 中 showOne（div 始终隐藏）或 count（当我将 ng-hide 设置为 false 时为空白）的值。但是，当我将 ng-hide 设置为 false 时，它会正确显示名称。这让我认为这是一个范围问题，但是，当我将 vm 的值打印到控制台时，showOne 和 count 的值是正确的。 Chrome ng-inspector 扩展程序证实了这一点。

【问题讨论】：

您需要检查几件事，首先检查发布请求是否成功以及是否正在调用创建函数，并检查是否使用 $.post 使用 Angular 的 $http 服务。并尝试在 create 函数的最后一行使用 $scope.$apply() 如果它有效，那么显然这是 $.post 本身的问题。
我可以肯定地确认 create 正在被调用，因为当我 console.log(vm) 显示正确的计数值并将 showOne 显示为 true 时。我还应该尝试 Angular 的 HTTP 吗？

标签： javascript angularjs controller

【解决方案1】：

尝试将更新功能添加到 vm。

vm.action = action;

如果你不这样做，它就不能在闭包之外调用（即在你的 html 中）。

【讨论】：

你说的更新是指哪一个？行动？还是新功能？
对不起，我在手机上，编辑了我的答案。我的意思是行动不更新
更新了问题 - 我的代码摘录得很糟糕。谢谢！

【解决方案2】：

实际上，您正在使用 $.post ，它在 Angular js 的上下文之外，因此从 create 方法来看，摘要循环正常工作。所以解决它有两种选择。

您需要使用 $.post 来代替

$http({
  method: 'POST',
  url: 'php/one.php'
}).then(function successCallback(response) {
   create(JSON.parse(response));
}, function errorCallback(response) {
});

或者你需要稍微修改一下create函数

function create(data) {
  var countArray = data[0];
  vm.count = countArray[0];
  vm.showOne = true;
  $scope.$apply();
}

在这两种情况下，您都需要相应地在控制器中注入 $http 和 $scope。

【讨论】：