javascript - AngularJS 加载 JSON 数据然后从中解析/加载 HTML

Question

首先，这是我第一次接触 Angular。

我想要实现的是，我有一个通知列表，我必须以某种方式限制 limitTo，因此元素被限制为三个，在我单击按钮后，其余的应该加载。

我不明白该怎么做:

• 设置“ View ”以及如何应用 ng-repeat
• 加载我设置的 JSON 数据，并以某种方式将其作为纯 HTML 从 *json 解析到 View 中
• 一切顺利后，使用 limitTo，这样我就可以从一开始就将项目限制为 3 个，在我单击按钮后，我希望将其余项目加载到下方。

我请求帮助，这是我所能达到的。

示例代码，因为 SO 需要它:

var app = angular.module('notifyApp', []);

app.controller('mainController', function($scope, $http) {

$http({
    method: 'GET',
    url: 'notifications.json'
}).success(function(){
    console.log('success');
}).error(function(){
    console.log('error');
});

$scope.loadmore = true;
});

这是一个Plunker

提前致谢!

Answer 1

你的 plunker 有几个错误。

首先，您的 ng-app在 index.html 中应该是 notifyApp ，因为这就是您在 script.js 中设置的内容- var app = angular.module('notifyApp', []);

其次:您必须将通知分配给 $scope.notifications在您的成功功能中。

$http({
    method: 'GET',
    url: 'notifications.json'
}).then(function(res){
    $scope.notifications = res;
});

之后您应该已经看到前 3 个元素。

您最不需要的就是删除 notifications = !notifications从加载更多按钮的 ng-click属性。

修改后的 Plunker here .