TypeError: Cannot set property 'description' of undefined when using angularjs $http get request

TypeError: Cannot set property 'description' of undefined when using angularjs $http get request

我有一个控制器,可以从用户那里获取信息并为他找到完美的水果。如果在我的 json 文件中没有水果的描述,它将从维基百科 (wikimedia api) 中获取。

问题是我无法将承诺附加到描述变量。

如果你可以看一下,我会很感激,

谢谢

    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
    });
}]);

我建议将获取功能放入服务或工厂中,但它会在控制器内部运行。

我建议采用两部分方法。使用 $templateRequest 访问您的 JSON,然后如果没有数据,则使用 $http.

调用 Wiki

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

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

抱歉,它只是点击了整个对象,而不仅仅是新的 属性 是未定义的。以上将不起作用。

您是否考虑过在成功函数中使用回调函数?

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

通过将分配移出成功,您可以解决导致它未定义的问题。

我是这样解决的:

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;
                                }
                            });
    }
}]);