ng-repeat without HTML element (this time really w

2019-05-01 11:09发布

问题:

I want to get something like:

Line 1<br>
Line 2<br>
Line 3<br>
Line 4<br>
Line 5<br>

using ng-repeat. Lines should be separated by nothing except <br>

回答1:

Here is a simplistic directive that hard-codes the <br>

HTML:

<p hidden-repeat="lines"></p>

app.directive('hiddenRepeat',function($parse){
  return {
    link: function(scope, elem, attr){
      var data = $parse(attr.hiddenRepeat)(scope);
      if(data){
        for (var i=0;i< data.length;i++){ 
          elem.append(data[i]+ "<br />");
        }  
      }
    }
  };
});

See it in action: http://plnkr.co/edit/Y8eahPYmBr5ohbWCInde?p=preview

This solution allows you to specify the directive in an attribute (In this case, hidden-repeat). By using the attribute version of a directive, you can specify what the wrapping element is (In this case, a paragraph).