Как я могу использовать ng-switch для удовлетворения нескольких одинаковых условий?

58
7

Я хочу создать кусок HTML с AngularJS на основе состояния аутентификации.


Я использую ng-switch.


Проблема в том, что я хочу иметь несколько ударов по одному условию, но функция AngularJS удовлетворяет только последнему условию.


HTML прослушивается очень близко, из-за Bootrap с плавным расположением. span3 и span9 должны находиться непосредственно под row-fluid контейнером div, иначе он не будет плавать красиво. Поэтому я не могу ввести дополнительные ng-switch divs к нему...


<div class="row-fluid" ng-switch on="user.isAuthenticated">
<div class="span3" ng-switch-when="true"><div>
<div class="span9 spade-contentwrapper" ng-switch-when="true"><div>
<div class="spade-contentwrapper" ng-switch-when="false"><div>
<div>

См. мой упрощенный fiddle.

спросил(а) 2013-07-23T11:55:00+04:00 7 лет, 3 месяца назад
1
Решение
107

К сожалению, директива ng-switch поддерживает только несколько совпадений с версии 1.1.3 AngularJS.


Смотрите changelog, и этот commit как ссылка.

ответил(а) 2013-07-23T12:37:00+04:00 7 лет, 3 месяца назад
83

Angular 1.1.5 поддерживает ng-if. Вы можете посмотреть который. Тогда вы можете иметь независимые условия.

ответил(а) 2013-07-23T12:11:00+04:00 7 лет, 3 месяца назад
57

Кто-то перезаписал директиву ngSwitchWhen, чтобы включить параметр, позволяющий || операторы, вы можете найти исходный ответ здесь: http://docs.angularjs.org/api/ng.directive:ngSwitch by angabriel

config(function($routeProvider, $provide) {
/**
* overwrite angular directive ngSwitchWhen
* can handle ng-switch-when="value1 || value2 || value3"
*/
$provide.decorator('ngSwitchWhenDirective', function($delegate) {
$delegate[0].compile = function(element, attrs, transclude) {
return function(scope, element, attr, ctrl) {
var subCases = [attrs.ngSwitchWhen];
if(attrs.ngSwitchWhen && attrs.ngSwitchWhen.length > 0 && attrs.ngSwitchWhen.indexOf('||') != -1) {
subCases = attrs.ngSwitchWhen.split('||');
}
var i=0;
var casee;
var len = subCases.length;
while(i<len) {
casee = $.trim(subCases[i++]);
ctrl.cases['!' + casee] = (ctrl.cases['!' + casee] || []);
ctrl.cases['!' + casee].push({ transclude: transclude, element: element });
}
}
}
return $delegate;
});
});

ответил(а) 2013-10-03T00:01:00+04:00 7 лет назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема