AngularJs $scope 就像一个本地变量

Question

我有一些问题。

app.controller('groupConfigCntrl', ['$http', '$scope', '$routeParams', function($http, $scope, $routeParams){

            var id = $routeParams.id,
                info = {};
            $http.post("/g/getGroup/", {id: id}).success(function(data) {
              $scope.info = data;
            });
              console.log($scope.info); 
    });

在这种情况下，$scope.info 未定义。

        $http.post("/g/getGroup/", {id: id}).success(function(data) {
          $scope.info = data;
          console.log($scope.info); 
        });

在这种情况下，$scope.info - 有一些数据。为什么 $scope 表现得像一个局部变量？帮助，当我尝试在视图中绑定数据时它不起作用。但是在类似的控制器中它可以工作。

控制器有效：

app.controller('groupCntrl', ['$http', '$scope', '$uibModal', '$routeParams', '$location', function($http, $scope, $uibModal, $routeParams, $location){
    var id = $routeParams.id;
    $http.post("/g/getGroup/", {id: id}).success(function(data) {
      $scope.info = data;
    });
})

Answer 1

变量 $scope.info 在 $http post 完成后的成功回调中定义。

$http.post("/g/getGroup/", {id: id}).success(function(data) {
              $scope.info = data;
              console.log($scope.info); 
            });

您无法访问 $scope.info，因为它在 $http 调用之前未定义。

Answer 2

这是因为callback。当你在第一种情况下 console.log 时，它在回调返回之前执行，此时 $scope.info 是 undefined。执行以下操作以获得预期结果：

app.controller('groupConfigCntrl', ['$http', '$scope', '$routeParams', function($http, $scope, $routeParams){

            var id = $routeParams.id,
                info = {};
            $http.post("/g/getGroup/", {id: id}).success(function(data) {
              $scope.info = data;
              console.log($scope.info); 
            });

    });

如果您想了解 callback 在 javascript 中的工作原理，可以查看 nexttick。例如：https://howtonode.org/understanding-process-next-tick

Answer 3

在您的示例中，.success() 方法是一个回调。当 post 方法完成时，该方法异步执行。

这意味着当您在第一个示例中记录输出时，$scope.info 值可能尚未设置。

根据您的评论，我怀疑您遇到的问题是在设置 $scope.info 值时视图没有更新？如果是这种情况，您需要将回调包装在 $apply 方法中

$http.post("/g/getGroup/", {id: id}).success(function(data) {
  $scope.$apply(function(){
    $scope.info = data;
  });
});

AngularJs $scope 就像一个本地变量

AngularJs $scope like a local var

javascript

angularjs

angularjs-scope

angular-http