html - Angular 中的变量作用域

Question

我正在使用 Angular 构建一个简单的网页注册表单，将数据存储在 Parse 中。

controller('AppCtrl', ['$scope', '$rootScope', function($scope, $rootScope) {

    $rootScope.groupCreated = false;

    $scope.signUp = function(form) {

        var Group = Parse.Object.extend("AdminOrg");
        var group = new Group();
        group.set("groupName", form.name);
        group.set("groupPassword", form.password);

            group.save(null, {
                  success: function(data) {
                      $rootScope.groupCreated = true;

                  },
                  error: function(data, error) {
                    alert(error.message);
                  }
                });
      };
}]);

我在我的 HTML 中使用 $rootScope.groupCreated 来隐藏注册表单，并在调用成功函数后显示“组已成功创建”消息。该值已成功更改为 true，但未更改 html View 。我正在使用以下内容来隐藏和显示两个 div:

ng-hide="$rootScope.groupCreated"
ng-show="$rootScope.groupCreated"

我是否在我的 HTML 中错误地访问了 $rootScope？

Answer 1

嗯，Angular 只是不知道你已经改变了范围内的某些东西，因为 Parse 函数不是 Angular 生态系统的一部分，所以不包含在摘要检查循环中。只需使用 $apply 手动让 Angular 知道方法:

group.save(null, {
    success: function (data) {
        $rootScope.groupCreated = true;
        $rootScope.$apply();
    },
    error: function (data, error) {
        alert(error.message);
    }
});

还有另一个问题，感谢 vp_arth 在评论中注意到:您没有在 Agnular 表达式中使用 $rootScope 前缀:

ng-show="groupCreated"