我遇到了一个基本问题,尽管我不明白为什么它不起作用:
<article id="desktop">
<h3>Content: </h3>
<ul>
<li ng-repeat="x in storage">
name: {{x.name}}
</li>
</ul>
</article>
还有我的 Angular :
$scope.storage = [];
...
$scope.showDesktop = function(){
$http.get("/getDesktop").then(function(response){
for(var i = 0; i<response.data.length; i++){
$scope.storage.push({
name: response.data[i]
});
}
console.log($scope.storage);
return;
});
}
肯定有语法错误,但我不知道它在哪里。 我已经查看了文档并复制了 ng-repeat 语法,但它仍然不起作用。
Console.log 仅显示正确的内容。
我的 Spring Controller 如下所示:
//Returns Desktop
@GetMapping("/getDesktop")
public ArrayList<String> getDesktop() throws Exception {
ArrayList<String> itemNames = new ArrayList<>();
if(kdxF.getLogged() && kdxF.getUser() != null) {
itemNames = kdxF.showDesktop();
}else {
throw new Exception("Not logged in!");
}
return itemNames;
}
最佳答案
您需要确定变量的范围才能从 html 访问它
var storage = []; //It is a private declaration and html has no access to it
使用 $scope.storage = [];
对其进行转换,然后 ng-repeat 将可以访问它。
也不要忘记更改 api 中的变量
$http.get("/getDesktop").then(function(response){
for(var i = 0; i<response.data.length; i++){
$scope.storage.push({
name: response.data[i]
});
}
console.log($scope.storage);
return;
}, function (err){
//log the error callback
console.log(err);
});
已编辑:一个可能的问题可能是由于 ng-repeat 跟踪序列造成的。为此,我们使用 ng-repeat="x in storage track by $index"
确保您在 api 调用中记录错误响应。
关于javascript - ng重复不显示内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53209448/