javascript - Angular-ish 函数在模板中输出 lorem ipsum 文本？

Question

我想要某种机制在我的模板中输入随机占位符文本。目前我只是认为过滤器符合要求。因此我写了这样的东西:

angular.module('web')
.filter('lorem', function(){
  var json = [
    //..data
  ];

  return function(_, ord) {
    var index = Math.floor(Math.random() * 10);
    console.log('Index1:', index);
    if (index >= json.length) {
      index = json.length - 1;
    }
    console.log('Index2:', index);
    return json[index][ord];
  }
});

以下是如何在模板中使用它的示例:

{{'' | lorem:'text1' }}

普朗克:http://plnkr.co/edit/uL4AAYmmbWkC8ofQ00FO?p=preview

有更好的方法吗？

Answer 1

你可以做到这一点。它更加动态。您可以在<li>中指定您需要的文本数量。 .

index.html

 <li ng-repeat="i in FinalJson">
    {{ i }}
  </li>

app.js

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

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.list = Array.apply(null, {length: 5}).map(Number.call, Number);
  console.log($scope.list);

   var json = [
    "ut commodo do",
    "ad amet reprehenderit officia pariatur deserunt magna",
    "pariatur culpa do",
    "do tempor laboris adipisicing est aliquip deserunt cillum occaecat culpa eu irure",
    "reprehenderit duis magna cillum veniam aute",
    "veniam nisi labore",
    "deserunt id nulla",
    "amet amet laborum laboris enim",
    "occaecat ullamco excepteur sit et",
    "laborum ut id"
  ];

  $scope.requiredText=5;
  var requiredText=5;
  var length = json.length;
  $scope.FinalJson=[];

  for(i=0;i<length;i++){
    var index = Math.floor(Math.random() * length);
    if($scope.FinalJson.indexOf(json[index])==-1){
       $scope.FinalJson.push(json[index]);
    }
   if($scope.FinalJson.length==$scope.requiredText){
     break;
   }
 }
});

无需为此制作额外的过滤器。这应该效果很好。