Javascript Angular JS:Service：翻开添加更多div/sections的页面？

我在一个页面1中有6个小部件。当第7个小部件添加到页面1时，我想将页面1翻转到页面2。为了添加小部件，我使用Angular JS

您也可以在javascript或jQuery中建议相同问题的解决方案。

我的recordsService.js如下所示：

app.service('recordsService', function () {
this.getRecords = function () {
    return records;
};

this.insertRecord = function (newWidgets) {
    records.push(neWWidgets);
};


this.getRecord = function (id) {
    for (var i = 0; i < records.length; i++) {
        if (records[i].id === id) {
            return records[i];
        }
    }
    return null;
};

这是我真正需要的图片。当有人点击链接时，这里有5个div是可见的。1第6个div将被添加到下一页，因此只有新的第6个div才能显示下一页

---

正在寻求帮助。谢谢

嗨，维巴夫！你说的第一页到第二页是什么意思？是否要指向另一个url？js fiddle将有助于更好地理解您的问题。@SelvamPalanimalai:Page1和Page2是数据ng视图的一部分，所以url必须相同。我只需要翻转视图部分（使用相同的url）。代码非常复杂，这就是为什么无法创建fiddle。ng-view用于路由。因此，如果您不想更改url，可以使用ng show和ng hide。视图是否在单独的html文件中？或者它们是divs？视图是单独的HTML文件，名称为record-list.HTML。ng show&ng hide很好，但它们仅用于显示和隐藏div，而不是在有人添加更多div时翻转视图部分。ok。因此，您需要将外部html文件加载到视图中，并在添加小部件时显示。如果我做对了，那么您需要使用ngInclude指令。

 app.controller('RecordsController', function ($scope, recordsService) {

init(); 
function init() {
    $scope.records = recordsService.getRecords();
}   
$scope.insertRecord = function (type) {

    if(type=="tag")
        {

    var newWidgets =
    {
        "id": 7,
        "age" : "7"
     };  
        recordsService.insertRecord(newWidgets);
  }
        };

  });