parent
af996ef0c4
commit
fdf4309b50
|
@ -10,7 +10,7 @@ import {Directive, Host, Input, TemplateRef, ViewContainerRef} from '@angular/co
|
||||||
|
|
||||||
import {ListWrapper} from '../facade/collection';
|
import {ListWrapper} from '../facade/collection';
|
||||||
|
|
||||||
const _CASE_DEFAULT = new Object();
|
const _CASE_DEFAULT = {};
|
||||||
|
|
||||||
export class SwitchView {
|
export class SwitchView {
|
||||||
constructor(
|
constructor(
|
||||||
|
@ -53,8 +53,7 @@ export class SwitchView {
|
||||||
* root elements.
|
* root elements.
|
||||||
*
|
*
|
||||||
* Elements within `NgSwitch` but outside of a `NgSwitchCase` or `NgSwitchDefault` directives will
|
* Elements within `NgSwitch` but outside of a `NgSwitchCase` or `NgSwitchDefault` directives will
|
||||||
* be
|
* be preserved at the location.
|
||||||
* preserved at the location.
|
|
||||||
*
|
*
|
||||||
* The `ngSwitchCase` directive informs the parent `NgSwitch` of which view to display when the
|
* The `ngSwitchCase` directive informs the parent `NgSwitch` of which view to display when the
|
||||||
* expression is evaluated.
|
* expression is evaluated.
|
||||||
|
@ -72,18 +71,23 @@ export class NgSwitch {
|
||||||
|
|
||||||
@Input()
|
@Input()
|
||||||
set ngSwitch(value: any) {
|
set ngSwitch(value: any) {
|
||||||
// Empty the currently active ViewContainers
|
// Set of views to display for this value
|
||||||
this._emptyAllActiveViews();
|
|
||||||
|
|
||||||
// Add the ViewContainers matching the value (with a fallback to default)
|
|
||||||
this._useDefault = false;
|
|
||||||
let views = this._valueViews.get(value);
|
let views = this._valueViews.get(value);
|
||||||
if (!views) {
|
|
||||||
this._useDefault = true;
|
|
||||||
views = this._valueViews.get(_CASE_DEFAULT) || null;
|
|
||||||
}
|
|
||||||
this._activateViews(views);
|
|
||||||
|
|
||||||
|
if (views) {
|
||||||
|
this._useDefault = false;
|
||||||
|
} else {
|
||||||
|
// No view to display for the current value -> default case
|
||||||
|
// Nothing to do if the default case was already active
|
||||||
|
if (this._useDefault) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this._useDefault = true;
|
||||||
|
views = this._valueViews.get(_CASE_DEFAULT);
|
||||||
|
}
|
||||||
|
|
||||||
|
this._emptyAllActiveViews();
|
||||||
|
this._activateViews(views);
|
||||||
this._switchValue = value;
|
this._switchValue = value;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -119,7 +123,7 @@ export class NgSwitch {
|
||||||
this._activeViews = [];
|
this._activeViews = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
private _activateViews(views: SwitchView[]): void {
|
private _activateViews(views?: SwitchView[]): void {
|
||||||
if (views) {
|
if (views) {
|
||||||
for (var i = 0; i < views.length; i++) {
|
for (var i = 0; i < views.length; i++) {
|
||||||
views[i].create();
|
views[i].create();
|
||||||
|
|
|
@ -50,25 +50,6 @@ export function main() {
|
||||||
detectChangesAndExpectText('when b');
|
detectChangesAndExpectText('when b');
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// TODO(robwormald): deprecate and remove
|
|
||||||
it('should switch amongst when values using switchCase', async(() => {
|
|
||||||
const template = '<div>' +
|
|
||||||
'<ul [ngSwitch]="switchValue">' +
|
|
||||||
'<template ngSwitchCase="a"><li>when a</li></template>' +
|
|
||||||
'<template ngSwitchCase="b"><li>when b</li></template>' +
|
|
||||||
'</ul></div>';
|
|
||||||
|
|
||||||
fixture = createTestComponent(template);
|
|
||||||
|
|
||||||
detectChangesAndExpectText('');
|
|
||||||
|
|
||||||
getComponent().switchValue = 'a';
|
|
||||||
detectChangesAndExpectText('when a');
|
|
||||||
|
|
||||||
getComponent().switchValue = 'b';
|
|
||||||
detectChangesAndExpectText('when b');
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should switch amongst when values with fallback to default', async(() => {
|
it('should switch amongst when values with fallback to default', async(() => {
|
||||||
const template = '<div>' +
|
const template = '<div>' +
|
||||||
'<ul [ngSwitch]="switchValue">' +
|
'<ul [ngSwitch]="switchValue">' +
|
||||||
|
@ -84,6 +65,9 @@ export function main() {
|
||||||
|
|
||||||
getComponent().switchValue = 'b';
|
getComponent().switchValue = 'b';
|
||||||
detectChangesAndExpectText('when default');
|
detectChangesAndExpectText('when default');
|
||||||
|
|
||||||
|
getComponent().switchValue = 'c';
|
||||||
|
detectChangesAndExpectText('when default');
|
||||||
}));
|
}));
|
||||||
|
|
||||||
it('should support multiple whens with the same value', async(() => {
|
it('should support multiple whens with the same value', async(() => {
|
||||||
|
|
|
@ -15,6 +15,10 @@ export class TreeComponent {
|
||||||
data: TreeNode = emptyTree;
|
data: TreeNode = emptyTree;
|
||||||
}
|
}
|
||||||
|
|
||||||
@NgModule({imports: [BrowserModule], bootstrap: [TreeComponent], declarations: [TreeComponent]})
|
@NgModule({
|
||||||
|
imports: [BrowserModule],
|
||||||
|
bootstrap: [TreeComponent],
|
||||||
|
declarations: [TreeComponent],
|
||||||
|
})
|
||||||
export class AppModule {
|
export class AppModule {
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue