Search code examples
arraysangularjsstringangular-nglist

Display array as list in angular


I have an array in my javascript called "animals":

var animals = ["dog", "cat", "horse", "cow"];

My html is:

<p>{{animals}}</p>

Currently it is displaying like so:

["dog", "cat", "horse", "cow"]

I'd like it to display like so:

dog
cat
horse
cow

I've looked at the official Angular documentation for the ng-list directive and am still scratching my head. Is there perhaps another (better) directive for this?

Advice is appreciated.


Solution

  • Use ng-repeat:

    <p ng-repeat="animal in animals">{{animal}}</p>
    

    or

    <ul>
        <li ng-repeat="animal in animals">{{animal}}</li>
    </ul>