diff --git a/modules/angular2/src/router/router_outlet.js b/modules/angular2/src/router/router_outlet.js
index 1504fae9db..21c5197776 100644
--- a/modules/angular2/src/router/router_outlet.js
+++ b/modules/angular2/src/router/router_outlet.js
@@ -1,6 +1,8 @@
import {Promise, PromiseWrapper} from 'angular2/src/facade/async';
+import {isBlank} from 'angular2/src/facade/lang';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
+import {Attribute} from 'angular2/src/core/annotations_impl/di';
import {Compiler, ViewContainerRef} from 'angular2/core';
import {Injector, bind} from 'angular2/di';
@@ -16,12 +18,15 @@ export class RouterOutlet {
_router:routerMod.Router;
_viewContainer:ViewContainerRef;
- constructor(viewContainer:ViewContainerRef, compiler:Compiler, router:routerMod.Router, injector:Injector) {
+ constructor(viewContainer:ViewContainerRef, compiler:Compiler, router:routerMod.Router, injector:Injector, @Attribute('name') nameAttr) {
+ if (isBlank(nameAttr)) {
+ nameAttr = 'default';
+ }
this._router = router;
this._viewContainer = viewContainer;
this._compiler = compiler;
this._injector = injector;
- this._router.registerOutlet(this);
+ this._router.registerOutlet(this, nameAttr);
}
activate(instruction:Instruction) {
diff --git a/modules/angular2/test/router/outlet_spec.js b/modules/angular2/test/router/outlet_spec.js
index 272f64061d..6960c78770 100644
--- a/modules/angular2/test/router/outlet_spec.js
+++ b/modules/angular2/test/router/outlet_spec.js
@@ -99,6 +99,24 @@ export function main() {
}));
+ it('should work with sibling routers', inject([AsyncTestCompleter], (async) => {
+ compile('left { } | right { }')
+ .then((_) => rtr.config({'path': '/ab', 'components': {'left': A, 'right': B} }))
+ .then((_) => rtr.config({'path': '/ba', 'components': {'left': B, 'right': A} }))
+ .then((_) => rtr.navigate('/ab'))
+ .then((_) => {
+ view.detectChanges();
+ expect(view.rootNodes).toHaveText('left { A } | right { B }');
+ })
+ .then((_) => rtr.navigate('/ba'))
+ .then((_) => {
+ view.detectChanges();
+ expect(view.rootNodes).toHaveText('left { B } | right { A }');
+ async.done();
+ });
+ }));
+
+
it('should generate link hrefs', inject([AsyncTestCompleter], (async) => {
ctx.name = 'brian';
compile('{{name}}')
@@ -130,6 +148,24 @@ class HelloCmp {
}
+@Component({
+ selector: 'a-cmp'
+})
+@View({
+ template: "A"
+})
+class A {}
+
+
+@Component({
+ selector: 'b-cmp'
+})
+@View({
+ template: "B"
+})
+class B {}
+
+
@Component({
selector: 'user-cmp'
})