AngularJS rendering different template inside ng-repeat using ng-view

Question

I would like to apologize that I couldn't provide any code snippet regarding this question, I am a newbie about AngularJS.

<div ng-repeat="item in list" ng-view></div>

Using the code above, would it be possible to render different template which would be dependent on item.type property. I was expecting a result like this:

• item.type == "image" returning: <div><img src="'IMAGE_URI'"></div>
• item.type == "text" returning: <div><p>TEXT</p></div>

As of now I have create a template html for the enumeration of item.type. Is this concern possible using AngularJS? I've recently learned that ng-view accompannied with ng-route.

Answer 1

I think one way you can do it is to use 'ng-if' to conditionally include html:

 <div ng-repeat="item in list">
      <div ng-if="item.type == 'image'><img src="'IMAGE_URI'"></div>
      <div ng-if="item.type == 'text'><div><p>TEXT</p></div>
 </div>