Question

我有一个html页面，就是从js文件中调用JSON数据。 html如下：

<html>
<head>
    <meta charset="UTF-8">
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script type="text/javascript" src="modules/app.js" ></script>

</script>
<title>
</title>

</head>
<body ng-app="albumsApp">
<div data-ng-controller="albumController">

    <ul data-ng-repeat="album in albums">
    <li>
      {{albums.title}}
    </li>
  </ul>  

</div>

</body>
</html>

＆＃34; app.js＆＃34;它调用的文件如下：

**

var albumsApp = angular.module ('albumsApp',[])
albumsApp.factory('albumFactory',function() {
return {
    getAlbums: function(){
        alert("test");
        return [{"artist": "Kid 606","title:":"Happiness"}];
        },
    };
});
albumsApp.controller ('albumController', function ($scope,albumFactory) {
$scope.albums = albumFactory.getAlbums();
});

** 运行时控制台中也没有错误，只显示任何内容。警报框＆＃34;测试＆＃34;当我加载页面以便调用该函数时它出现，它只是不显示JSON。感谢您的回复。

Answer 1

改变这个：

{{albums.title}}

到

{{album.title}}

Answer 2

现在没关系，非常感谢。

HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script type="text/javascript" src="modules/app.js" ></script>

</script>
<title>
</title>

</head>
<body ng-app="albumsApp">
<div data-ng-controller="albumController">

    <ul data-ng-repeat="album in albums">
    <li>
      Artist is "{{album.artist}} " and title is {{album.title}}

    </li>
  </ul>  

</div>

</body>
</html>

JS是

var albumsApp = angular.module ('albumsApp',[])

albumsApp.factory('albumFactory',function() {
return {
    getAlbums: function(){

        return [{"artist": "Kid 606","title":"Happiness"}];
        },
    };
});
albumsApp.controller ('albumController', function ($scope,albumFactory) {
$scope.albums = albumFactory.getAlbums();
});

JSON未显示在页面

2 个答案: