TypeError：使用angularjs$超文本传输协议获取请求时，无法设置未定义的属性'描述'

Question

我有一个控制器，可以从用户那里获取信息，为他找到完美的水果。如果在我的json文件中没有对水果的描述，它将从wikipedia（WikimediaAPI）获取。

问题是我不能将promise附加到描述变量。

我希望你能看看，

谢谢

    app.controller('fruitsCtrl', ['$scope', '$http', 'preferences', function ($scope, $http, preferences) {

    $scope.preferences = preferences; //what kind of fruits preferences the user have

    // local json files that has info about certain fruits
    $http.get("partials/fruits.json").then(function(response) {
        $scope.data = response.data; // Question -> is this good practice???
        $scope.fruits = {};

    // look at json file for fruits that correspond the preferences
        for (i = 0; i < $scope.preferences.length; i++) {
            for (l = 0; l < $scope.data.length; l++) {
                if($scope.data[l].fruitProperties.indexOf($scope.preferences[i]) > -1){
                    // add this fruit details to the fruits object
                    $scope.fruits[l] = $scope.data[l];
    // if description of fruit is not in json file it 
    // will have a var - "wikiname" to get it from wikimedia API
                    if ($scope.fruits[l].description === undefined){
                        var wiki = $scope.fruits[l].wikiName;
                        // with wikimedia I can use only $http and not $http.get
                        $http({
                            url: $scope.url = "https://en.wikipedia.org/w/api.php?format=json&callback=JSON_CALLBACK&action=query&prop=extracts&exintro=true&titles="+wiki,
                            method: 'jsonp'
                        }).success(function(response) {
                            for(var id in response.query.pages) {
                                $scope.fruits[l].description = response.query.pages[id].extract;
                            }
                        });

                    }
                }
            }
        }
    }, function () {
        $scope.sites = [{action: "Error"}] //add somthing in case of error
    });
}]);

Answer 1

我就是这样解决的：

app.controller('fruitsCtrl', ['$scope', '$http', 'preferences', function ($scope, $http, preferences) {

$scope.preferences = preferences; //what kind of fruits preferences the user have

// local json files that has info about certain fruits
$http.get("partials/fruits.json").then(function(response) {
    $scope.data = response.data; // Question -> is this good practice???
    $scope.fruits = {};

// look at json file for fruits that correspond the preferences
    for (i = 0; i < $scope.preferences.length; i++) {
        for (l = 0; l < $scope.data.length; l++) {
            if($scope.data[l].fruitProperties.indexOf($scope.preferences[i]) > -1){
                // add this fruit details to the fruits object
                $scope.fruits[l] = $scope.data[l];
                getMissingFruitsDescriptionFromWiki($scope.fruits, l);
                }
            }
        }
    }
}, function () {
    $scope.sites = [{action: "Error"}] //add somthing in case of error
});

function getMissingFruitsDescriptionFromWiki (fruits, l) {
// if description of fruit is not in json file it 
// will have a var - "wikiname" to get it from wikimedia API
    if ($scope.fruits[l].description === undefined){
                            var wiki = $scope.fruits[l].wikiName;
                            // with wikimedia I can use only $http and not $http.get
                            $http.jsonp("https://en.wikipedia.org/w/api.php?format=json&callback=JSON_CALLBACK&action=query&prop=extracts&exintro=true&titles=""https://en.wikipedia.org/w/api.php?format=json&callback=JSON_CALLBACK&action=query&prop=extracts&exintro=true&titles="+wiki).success(function(response) {
                                for(var id in response.query.pages) {
                                    $scope.fruits[l].description = response.query.pages[id].extract;
                                }
                            });
    }
}]);

Answer 2

我建议将get功能放入服务或工厂，但它将在控制器内工作。

我建议采取两部分办法。使用$templateRequest访问您的JSON，然后如果没有数据，使用$超文本传输协议执行对Wiki的调用。

至于未定义的错误，我假设您正在尝试将其分配给对象是吗？如果是这样，请在分配之前尝试将其实例化为对象。

YourVarName.prop = {};
YourVarName.prop = response;

对不起，它只是点击了整个对象，而不仅仅是新属性是未定义的。以上都不行。

您是否考虑过在success函数中使用回调函数？

//Inside success
callback(response, l);
//End success
function callback (response, l) {
      $scope.yourproperties[l] = response;
} 

通过将任务移出success，您可以绕过导致任务未定义的问题。