Question

我从服务中调用JSON数据，它在View上显示完全正常。但是，我想知道为什么$ scope.item和$ scope.selectedItem在我尝试记录时为null（或未定义）。

angular.module('myApp')
  .controller('MainCtrl', function ($scope, dataService) {

    $scope.items = null;
    dataService.getData().then(function (data) {
      $scope.items = data;
    });
    console.log($scope.item);

    $scope.selectedItem = null;
    $scope.passSelection = function (data) {
      $scope.selectedItem = data;
    }
    console.log($scope.selectedItem);
});

Answer 1

当你记录它们时它可能是null以后加载数据时它们可能会被更新。试试这个！

angular.module('myApp')
.controller('MainCtrl', function ($scope, dataService) {

$scope.item = null;
dataService.getData().then(function (data) {
  $scope.item = data;
console.log($scope.item);
});


$scope.selectedItem = null;
$scope.passSelection = function (data) {
  $scope.selectedItem = data;
  console.log($scope.selectedItem);
}

});

Answer 2

因为您正在使用承诺，并且在您的承诺完成之前执行了日志调用。

Answer 3

这是竞争条件的问题。在将实际值设置为$ scope变量之前，您的console.logs会运行。通过移动console.logs，如下所示，您应该能够注销值。

angular.module('myApp')
  .controller('MainCtrl', function ($scope, dataService) {

  $scope.item = null;
  dataService.getData().then(function (data) {
      $scope.item = data;
      console.log($scope.item); //not undefined
  });
  console.log($scope.item); //undefined
  $scope.selectedItem = null;
  $scope.passSelection = function (data) {
     $scope.selectedItem = data;
     console.log($scope.selectedItem); //not undefined
  }
  console.log($scope.selectedItem); //undefined
});

Answer 4

您在记录时变为空，因为您要异步分配变量（在“then”中）。即你正在启动请求（getData），记录值（console.log），而不是在此之后请求完成并且回调（然后）触发。因此，当您尝试登录时，您的数据尚未设置。

如果您在回调中登录，则会看到正确的valyu。

$scope.item = null;
dataService.getData().then(function (data) {
  $scope.item = data;
  console.log($scope.item);
});

$ scope undefined在控制器中

4 个答案: