Question

所以我根据我的项目创建了一些实验..

我使用ng-switch angularjs指令

创建渲染条件

这是控制器

app.controller('MainCtrl', function($scope) {

  $scope.items = ['test1', 'test2', 'test3'];

  $scope.test = $scope.items[0];

});

同时，这是html元素

<select ng-model="test" ng-options="item for item in items"></select>
    <div ng-switch="test">
      <div ng-switch-when="test1">this is test 1</div>
      <div ng-switch-when="test2">this is test 2</div>
      <div ng-switch-when="test3">this is test 3</div>
      <div ng-switch-when="test3">this is test 3</div>
    </div>

正如你所知，当我更改选择框时，它应该根据选择框的选择呈现dom，奇怪的是当我选择值＆＃39; test3＆＃39;只有一个元素呈现，而我想要的是＆＃39; test3＆＃39; ng-swith-when条件呈现时

并且文件明确指出

要匹配的案例陈述。如果匹配那么这种情况就是显示。如果同一匹配出现多次，则所有元素将会显示。

我该如何解决这个问题？有人在意吗？

这是plunkr工作测试

请注意我使用的是angularjs 1.0.7版，我不想更改版本

Answer 1

您从新版本的angularjs文档中读到了什么，这是旧的：

https://code.angularjs.org/1.0.7/docs/api/ng.directive:ngSwitch

vs the new：

https://docs.angularjs.org/api/ng/directive/ngSwitch

加载1.1.3的更改日志是他们添加的地方：

https://github.com/angular/angular.js/blob/master/CHANGELOG.md#1.1.3

因此，要解决您的问题，只需将内容包装在一个div中：

<div ng-switch="test">
  <div ng-switch-when="test1">this is test 1</div>
  <div ng-switch-when="test2">this is test 2</div>
  <div ng-switch-when="test3">
        <div>this is test 3</div>
        <div>this is test 3</div>
  </div>
</div>

多个ng-switch-when条件只渲染一个DOM angularjs

1 个答案: