Question

所以，我在这里面临一个逻辑问题，我正在从一个对象迭代，在<options>

中创建一个<select>列表

好吧，现在我需要切换对应选定选项的视图

<div>
    <select class="select"
        name="singleSelect"
        ng-model="$ctrl.currentViewOption">
        <option value="">Choose a option</option>
        <option ng-selected="$ctrl.selected(item)"
            value="{{item.token}}"
            ng-repeat="item in $ctrl.listOptions">{{'Option '}} {{ $index + 1 }}</option>
    </select>
    <code>selection={{$ctrl.currentViewOption}}</code>
    <hr/>
    <div class="animate-switch-container"
        ng-switch on="$ctrl.currentViewOption">
        <div class="animate-switch" ng-switch-when="item.token === correspondentView">view1</div>
        <div class="animate-switch" ng-switch-when="">view2</div>
        <div class="animate-switch" ng-switch-default>default</div>
    </div>
</div>

每个选项的结构是：

{ ＆＃34;令牌＆＃34;：＆＃34; 56e6fe65712ed797f7014d40＆＃34;，＆＃34;状态＆＃34;：3，＆＃34; createdAt＆＃34;：＆＃34; someDate＆＃34;，＆＃34; updatedAt＆＃34;：＆＃34; someDate＆＃34;，＆＃34;内容＆＃34;：[＆＃34;这将包含呈现选项视图的所有数据＆＃34;] }

那么，我可以在我的控制器上做什么，根据这些项目切换视图？对于每个视图，我将根据此对象的content attr

呈现数据

Answer 1

为ng-switch-when指令设置的值是字符串，而不是表达式。见https://docs.angularjs.org/api/ng/directive/ngSwitch

如果您希望能够根据某些属性（例如currentViewOption的内容）进行切换，则必须使用以下内容：

 <div class="animate-switch-container"
    ng-switch on="$ctrl.currentViewOption.content">
    <div class="animate-switch" ng-switch-when="stringValueNecessaryToShowView1">view1</div>
    <div class="animate-switch" ng-switch-when="stringValueNecessaryToShowView2">view2</div>
    <div class="animate-switch" ng-switch-default>default</div>
</div>

在此示例中，当currentViewOption.content ==＆＃39; stringValueNecessaryToShowView1＆＃39;时，将显示view1。

AngularJS更改集合项之间的视图

1 个答案: