Question

HTML

<html lang="en" ng-app="map" xmlns="http://www.w3.org/1999/xhtml">
<body>
    <div ng-controller="topbarController as topbarCtrl">
    <div ng-repeat="pages in topbarCtrl.topbar">
        {{pages.page}}
    </div>
    </div>
</body>
</html>

角

    app.controller('topbarController', ['$http', function($http) {
    var topbar = this;
    topbar.pages = [];

    $http.get('/Hexdra/app/app_data/pages.json').success(function(data){
        topbar.pages = data;
    });
    }]);

JSON

[
{ "page": "about_me"},
{"page": "index"}
]

我正在尝试使用ng-repeat显示网页列表，并通过http.get从JSON加载页面数据。我的问题是加载时html页面上没有显示任何内容。

我检查了this但似乎无法解决问题。

我也很难跟踪所有不同的名字。

1。）我知道我的控制器被称为topbarController。在HTML中，控制器范围随后被重命名为topbarCtrl。

2。）然后我通过我的页面对象获得角度索引，并在其自己的div中显示每个页面。

修复得到赞赏，但也进一步阅读出错的地方也将受到赞赏。谢谢！

Answer 1

我必须多次查看您的代码，但问题出在以下几行：

var topbar = this;
topbar.pages = [];

您已在操作控制器中为此指定了上边栏

<div ng-repeat="pages in topbarCtrl.pages">

将ng-repeat更改为此，它将起作用

boolean

Answer 2

试试这个

app.controller('topbarController', ['$http', function($http) {
$scope.topbar {
     topbar.pages : []
     };

$http.get('/Hexdra/app/app_data/pages.json').success(function(data){
    $scope.topbar.pages.push(data);
});
}]);

你的html必须是这样的：

   <div ng-repeat="page in topbarCtrl.pages">
    {{page}}
</div>

Answer 3

你确定你提供的网址是否合适？例如，它应该像http://localhost:80/Hexdra/app/app_data/pages.json

尝试使用绝对网址并查看其是否有效

使用ng-repeat创建列表

HTML

角

JSON

3 个答案: