当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - AngularJS : Variations in a template based on a attribute

问题描述:

Say I have a controller in an AngularJS web app which has a data array that stores objects which are very similar but require a different template depending a member variable 'type'. For example :

function fooCtrl($scope) {

$scope.bar = [

{"name": "example 1",

"type": "egType1",

"text": "Some example text"},

{"name": "example 2",

"type": "egType2",

"text": "Some example text"},

{"name": "example 3",

"type": "egType3",

"text": "Some example text"},

];

}

One could easily create a template to output the data using the ng-repeat directive as follows :

<ul>

<li ng-repeat="item in bar">

{{item.name}}

<p>{{item.text}}</p>

</li>

</ul>

However this will result in each item having the same display.

What is the best method to output all the items in bar while being able to vary the template depending on the value of item.type?

网友答案:

I suppose you can use ngSwitch directive, with something like this:

<li ng-repeat="item in bar">
    <div ng-switch on="item.type">
        <div ng-switch-when="egType1">
            {{item.name}}
            <p>{{item.text}}</p>
        </div>
        <div ng-switch-when="egType2">
            XXX {{item.name}}
            <span>{{item.text}}</spab>
        </div>
        <div ng-switch-default>
            DEFAULT {{item.name}}
            <span>{{item.text}}</spab>
        </div>
    </div>
</li>
分享给朋友:
您可能感兴趣的文章:
随机阅读: