angular-ish函数在模板中输出lorem ipsum文本?

时间:2016-12-08 11:58:08

标签: javascript angularjs

我想要一些机制在我的模板中输入随机占位符文本。现在我只想过滤器符合要求。因此我写了这样的东西:

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

有更好的方法吗?

1 个答案:

答案 0 :(得分: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;
   }
 }
});

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