ng-switch-when中是否可以使用OR条件?
<div ng-repeat="w in windows" ng-show="visibleWindowId == w.id" ng-switch="w.type">
<div ng-switch-when="val1 **OR** val2">
sup
</div>
</div>
如果不行,那么上述内容该如何实现呢?谢谢 :)
ng-switch-when中是否可以使用OR条件?
<div ng-repeat="w in windows" ng-show="visibleWindowId == w.id" ng-switch="w.type">
<div ng-switch-when="val1 **OR** val2">
sup
</div>
</div>
如果不行,那么上述内容该如何实现呢?ngswitch
只允许您比较单个条件。ng-if
。
参考
需要注意的是,使用 ng-if
和 ng-switch
会 从DOM结构中移除元素,而不是显示和隐藏。+
, :first-child
, :empty
等时,这很相关。 - Tamlyn现在可以使用 ng-switch-when-separator
,它在Angular文档中添加于1.5.10版本:
<div ng-repeat="w in windows" ng-show="visibleWindowId == w.id" ng-switch="w.type">
<div ng-switch-when="val1|val2" ng-switch-when-separator="|">
sup
</div>
</div>
这也能够正常工作
<div ng-repeat="w in windows" ng-switch="w.type == 'val1' || w.type == 'val2'">
<div ng-switch-when="true">
sup
</div>
</div>
module.directive('jjSwitchWhen', function() {
// Exact same definition as ngSwitchWhen except for the link fn
return {
// Same as ngSwitchWhen
priority: 1200,
transclude: 'element',
require: '^ngSwitch',
link: function(scope, element, attrs, ctrl, $transclude) {
var caseStms = scope.$eval(attrs.jjSwitchWhen);
caseStms = angular.isArray(caseStms) ? caseStms : [caseStms];
angular.forEach(caseStms, function(caseStm) {
caseStm = '!' + caseStm;
ctrl.cases[caseStm] = ctrl.cases[caseStm] || [];
ctrl.cases[caseStm].push({ transclude: $transclude, element: element });
});
}
};
});
$scope.types = {
audio: '.mp3',
video: ['.mp4', '.gif'],
image: ['.jpg', '.png', '.gif'] // Can have multiple matching cases (.gif)
};
<div ng-switch="mediaType">
<div jj-switch-when="types.audio">Audio</div>
<div jj-switch-when="types.video">Video</div>
<div jj-switch-when="types.image">Image</div>
<!-- Even works with ngSwitchWhen -->
<div ng-switch-when=".docx">Document</div>
<div ng-switch-default>Invalid Type</div>
<div>
ng-switch-multiple-when
。 - haki您可以使用ng-class
以便在表达式中使用or
运算符。此外,Angular-ui还有if
指令。