Question

对不起，如果标题没有多大意义，我真的不知道更好的解释方式。

我有以下......

app.controller('viewProductController', ['$scope', 'dataFactory', '$routeParams', function($scope, dataFactory, $routeParams) {

        dataFactory.getProduct($routeParams.viewProduct)
            .success(function (data, status, headers, config) {
                $scope.product = data[0];
            })
            .error(function (data, status, headers, config) {

            });
  }]);

factory('dataFactory', ['$http', function($http) {

        var urlBase = 'get.php?get=';
        var dataFactory = {};

        dataFactory.getProducts = function () {
            return $http.get(urlBase + 'products');
        };
  }]);

当我转到DOM并使用{{product.product_name}}（示例）时它非常有效，但我想要的是能够在控制器中使用$scope.product.product_name，但是它未定义。< / p>

我认为这是因为$scope.product是在函数内部设置的，因此我不能在函数之外得到它。

如果我在设置的同一个函数中使用console.log($scope.product);，我会看到控制台内的数组，但是如果我在设置$scope.product的函数之外使用它，我就无法访问它说未定义。

谢谢！

Answer 1

这不是范围问题。 $scope在整个控制器中都可用，它不仅限于您的调用函数的范围。

您无法访问$scope.product，因为该变量是异步设置的。这意味着在$scope.product被调用并返回成功请求之前，dataFactory.getProduct不可用。如果您希望在控制器的其他部分中使用$scope.product，则必须等待首先分配它。

您可以使用$watch执行此操作。假设您有一个名为myFunction()的函数需要使用$scope.product，并且您希望在页面加载时调用myFunction()。

像

这样的东西

$scope.myFunction = function(){
    console.log($scope.product);
}
// You'll get undefined here since $scope.product needs to be set first
$scope.myFunction();

以上内容不会在控制台中打印出正确的值。但是下面会：

$scope.$watch('product', function(newValue){
    if(typeof newValue != 'undefined'){
        $scope.myFunction();
    }
});

您实际上是在$scope.product更改值时，请致电$scope.myFunction()

Answer 2

我认为这是因为$ scope.product是在函数内部设置的，因此我不能在功能之外得到这个。

不，这不是功能范围问题，而是时间问题。

$http.get方法是异步的，这意味着当响应到达时，将调用您指定的success回调。

您无法访问回调函数之外的数据，因为它尚不存在。您想要使用数据的任何内容都必须在回调函数中执行，否则它将在数据可用之前运行。

Answer 3

您的问题不是内部/外部问题......您的问题是前/后问题！

执行控制器时，会启动数据请求，但需要一些时间才能完成。其余的控制器代码立即执行，但尚未分配$ scope.product。

您可以在产品变量上设置$ watch，并在其值发生变化时执行您需要执行的操作

$scope.$watch('product', function(newValue,oldValue){

    // do whatever

});

从外部函数访问$ http数据

3 个答案: