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;
}
});
}
}]);
我有一个控制器,可以从用户那里获取信息并为他找到完美的水果。如果在我的 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;
}
});
}
}]);