Question

我有一个相当简单的问题。我有一个简单的控制器，它的$ scope.coords = [];在HTML中呈现JSON：

[24.43359375, 54.6611237221]
[25.2905273438, 54.6738309659]
[25.3344726562, 54.6102549816]
[25.2685546875, 54.6801830971]
[25.2960205078, 54.6611237221]

如何在html中渲染JSON，而在我的控制器本身？代码看起来像那样。请参阅代码中的评论：

propertyModule.controller('propertyController', ['$scope', 'Property', function ($scope, Property) {

        // Query returns an array of objects, MyModel.objects.all() by default
        $scope.properties = Property.query();

        // Getting a single object
        $scope.property = Property.get({pk: 1});

        $scope.coords  = [];

        $scope.properties = Property.query({}, function(data){

        console.log(data);

        angular.forEach(data , function(value){

            $scope.coords.push(value.coordinates);

        });

        });

        $scope.positions =  //$Resource('realestate.property').items();

        [

        [54.6833, 25.2833], [54.67833, 25.3033] // those coordinates are hardcoded now, I want them to be rendered here by $scope.coords


        ];


    }]);

Answer 1

首先，您向我们展示了一堆数组，而不是JSON文档。但是，由于您的代码似乎正在运行，我假设您确实有一个有效的JSON可以使用。

您需要考虑以下事实：您在此处发出异步请求：

$scope.properties = Property.query({}, function(data) {

    console.log(data);

    angular.forEach(data , function(value){
        $scope.coords.push(value.coordinates);
    });

});

这意味着您无法在任何事情到来之前从$ scope.coords获取数据。

有几种方法可以解决这个问题：

您只需在循环中获取数据：

angular.forEach(data , function(value) {
    $scope.coords.push(value.coordinates);
    if('your condition') {
        $scope.positions.push(value.coordinates);
    }    
});

您可以使用承诺，请参阅angular doc。
或者您可以通过$ scope查看$ scope.coords。$ watch。

Angular.js在控制器中呈现数据

1 个答案: