如果不存在任何段落，Angular JS将默认创建段落

Angular JS create paragraphs by default if none are present

本文关键字：JS 默认 创建 段落 Angular 如果不 不存在 任何段 如果      更新时间：2023-09-26

我正在从json文件中添加段落。我如何计算它们（我尝试使用.length），如果少于10个，我需要创建默认的，并将它们添加到页面上？例如，用户可以添加带有一些自定义文本的段落，如果他添加了3个段落，我想在默认情况下再添加7个。所以所有的时间10都出现在页面上。这是我的结构，它目前显示了4段，因为我在json文件中只有4段：

<div class="row" ng-repeat="p in list.paragraphs" ng-class="isSelectedBoard(p)">
     <p class="slide-wrap" ng-click="setMasterBoard(p)">
         some text goes here
     </p>
</div>

所以，同样，如果用户不添加段落，我需要在页面上显示10和一些默认文本，如果用户添加1个段落，他将有1个自定义段落和9个默认段落等

有什么想法我该如何做到这一点吗？

谢谢。

编辑：

控制器：

$scope.list = {};
$http.get('name.json').success(function(data, status, headers, config) {
    $scope.list = data;
});

我会在控制器中执行此操作。在从json文件添加段落的函数中，在添加文件中的所有段落后，只需添加足够的默认段落，即可使paragraphs的长度等于10。

angular.module('app', []).controller('MyController', function($scope) {
  $scope.list = {
    paragraphs: [{
      text: 'This is a user paragraph.',
      defaultBG: '#000'
    }, {
      text: 'This is another user paragraph.',
      defaultBG: '#000'
    }, {
      text: 'This is a third user paragraph.',
      defaultBG: '#000'
    }]
  }
  var defaultParagraph = {
    text: 'This is a default paragraph.',
    defaultBG: '#000'
  };
  for (var i = $scope.list.paragraphs.length; i < 10; i++) {
    $scope.list.paragraphs.push(defaultParagraph);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyController">
  <div class="row" ng-repeat="p in list.paragraphs track by $index" ng-class="isSelectedBoard(p)">
    <p class="slide-wrap" ng-click="setMasterBoard(p)">
      {{p.text}}
    </p>
  </div>
</div>

相关文章：