Tag in ng-repeat angular -js

Question

I have an ng-repeat list <ul>. I want to insert <br>after each tag <ul>. How can i do this?

Here is my code

<ul class="list" ng-repeat="result in results">
    <li class="list__header">{{$index+1}}</li>
    <li class="list__item">{{result.name}}</li>
    <li class="list__item">{{result.address}}</li>
    <li class="list__item">{{result.phone_number}}</li>
</ul><br><br>

The above is <br>not renderd

Answer 1

Use ng-repeat-startand ng-repeat-end:

    <ul class="list" ng-repeat-start="result in results">
                   <li class="list__header">{{$index+1}}</li>
                   <li class="list__item">{{result.name}}</li>
                   <li class="list__item">{{result.address}}</li>
                    <li class="list__item">{{result.phone_number}}</li>
    </ul><br><br ng-repeat-end />

Documentation: https://docs.angularjs.org/api/ng/directive/ngRepeat#special-repeat-start-and-end-points

Answer 2

You can also use a custom directive for this purpose:

 .directive("insertAfter", function(){
    return {
        scope: {
            content: "@"
        }, 
        link: function(scope, element, attrs){
            element.after(scope.content);
        }
    }
  });

Then use it inside your list:

<ul class="list" ng-repeat="result in photos" insert-after content="<br>">...</ul>