<p dir="auto"><strong>IMPORTANT</strong>: This repository's issues are reserved for feature requests and bug reports. Do not submit support requests here, see <a href="https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question">https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question</a>.</p>
<p dir="auto"><strong>Steps to reproduce and a minimal demo of the problem</strong><br>
we are using beta 14 with babel compile. when we navigate from one path to a second path the component lifecycle is not being called. if anything happens on the compoent then the ngOnInit will be called.</p>
<p dir="auto">code pased below.</p>
<p dir="auto"><em>What steps should we try in your demo to see the problem?</em></p>
<p dir="auto"><strong>Current behavior</strong><br>
click on the task links, the routerOnActivate will be called but the ngOnInit will not be called. when we click on the back button then the ngOnInit will be called.</p>
<p dir="auto"><strong>Expected/desired behavior</strong><br>
ngOnInit should be called when we navigate to the component.</p>
<p dir="auto"><strong>Other information</strong><br>
main.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import 'angular2-polyfills';
import 'reflect-metadata';
import 'babel-polyfill';
import {bootstrap}    from 'angular2/platform/browser';
import {routeTestComponent} from './app.component';
import {ROUTER_PROVIDERS} from 'angular2/router';
bootstrap(routeTestComponent, [ROUTER_PROVIDERS]);"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-s">'angular2-polyfills'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-s">'reflect-metadata'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-s">'babel-polyfill'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-s1">bootstrap</span><span class="pl-kos">}</span>    <span class="pl-k">from</span> <span class="pl-s">'angular2/platform/browser'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-s1">routeTestComponent</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'./app.component'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-c1">ROUTER_PROVIDERS</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/router'</span><span class="pl-kos">;</span>
<span class="pl-en">bootstrap</span><span class="pl-kos">(</span><span class="pl-s1">routeTestComponent</span><span class="pl-kos">,</span> <span class="pl-kos">[</span><span class="pl-c1">ROUTER_PROVIDERS</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">app.component.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import {Component} from 'angular2/core';
import {ROUTER_DIRECTIVES,RouteConfig} from 'angular2/router';
import {Dashboard} from './components/dashboard/dashboard.component';
import {About} from './components/about/about.component';
import {Tasks} from './components/tasks/tasks.component';
@Component({
  selector: 'route-test',
  template: `
  &lt;h1&gt;App&lt;/h1&gt;
   &lt;a [routerLink]=&quot;['/Dashboard']&quot; class=&quot;link&quot;&gt;Dashboard&lt;/a&gt;
   &lt;a [routerLink]=&quot;['/About']&quot; class=&quot;link&quot;&gt;About&lt;/a&gt;
   &lt;a [routerLink]=&quot;['/Tasks']&quot; class=&quot;link&quot;&gt;Tasks&lt;/a&gt;
    &lt;router-outlet&gt;&lt;/router-outlet&gt;
  `,
  directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
  {path: '/', component: Dashboard, name: 'Dashboard'},
  {path: '/about', component: About, name: 'About'},
  {path: '/tasks/...', component: Tasks, name: 'Tasks'}

])
export class routeTestComponent { }"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Component</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/core'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-c1">ROUTER_DIRECTIVES</span><span class="pl-kos">,</span><span class="pl-v">RouteConfig</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/router'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Dashboard</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'./components/dashboard/dashboard.component'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">About</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'./components/about/about.component'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Tasks</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'./components/tasks/tasks.component'</span><span class="pl-kos">;</span>
@<span class="pl-v">Component</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">selector</span>: <span class="pl-s">'route-test'</span><span class="pl-kos">,</span>
  <span class="pl-c1">template</span>: <span class="pl-s">`</span>
<span class="pl-s">  &lt;h1&gt;App&lt;/h1&gt;</span>
<span class="pl-s">   &lt;a [routerLink]="['/Dashboard']" class="link"&gt;Dashboard&lt;/a&gt;</span>
<span class="pl-s">   &lt;a [routerLink]="['/About']" class="link"&gt;About&lt;/a&gt;</span>
<span class="pl-s">   &lt;a [routerLink]="['/Tasks']" class="link"&gt;Tasks&lt;/a&gt;</span>
<span class="pl-s">    &lt;router-outlet&gt;&lt;/router-outlet&gt;</span>
<span class="pl-s">  `</span><span class="pl-kos">,</span>
  <span class="pl-c1">directives</span>: <span class="pl-kos">[</span><span class="pl-c1">ROUTER_DIRECTIVES</span><span class="pl-kos">]</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>
@<span class="pl-v">RouteConfig</span><span class="pl-kos">(</span><span class="pl-kos">[</span>
  <span class="pl-kos">{</span><span class="pl-c1">path</span>: <span class="pl-s">'/'</span><span class="pl-kos">,</span> <span class="pl-c1">component</span>: <span class="pl-v">Dashboard</span><span class="pl-kos">,</span> <span class="pl-c1">name</span>: <span class="pl-s">'Dashboard'</span><span class="pl-kos">}</span><span class="pl-kos">,</span>
  <span class="pl-kos">{</span><span class="pl-c1">path</span>: <span class="pl-s">'/about'</span><span class="pl-kos">,</span> <span class="pl-c1">component</span>: <span class="pl-v">About</span><span class="pl-kos">,</span> <span class="pl-c1">name</span>: <span class="pl-s">'About'</span><span class="pl-kos">}</span><span class="pl-kos">,</span>
  <span class="pl-kos">{</span><span class="pl-c1">path</span>: <span class="pl-s">'/tasks/...'</span><span class="pl-kos">,</span> <span class="pl-c1">component</span>: <span class="pl-v">Tasks</span><span class="pl-kos">,</span> <span class="pl-c1">name</span>: <span class="pl-s">'Tasks'</span><span class="pl-kos">}</span>

<span class="pl-kos">]</span><span class="pl-kos">)</span>
<span class="pl-k">export</span> <span class="pl-k">class</span> <span class="pl-s1">routeTestComponent</span> <span class="pl-kos">{</span> <span class="pl-kos">}</span></pre></div>
<p dir="auto">components/dashboard</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import {Component} from 'angular2/core';
@Component({
  selector: 'dashboard',
  template: '&lt;h1&gt;Dashboard App&lt;/h1&gt;',
  directives: [],
  inputs:[],
  outputs:[],
  pipes:[]
})

export class Dashboard { }"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Component</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/core'</span><span class="pl-kos">;</span>
@<span class="pl-v">Component</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">selector</span>: <span class="pl-s">'dashboard'</span><span class="pl-kos">,</span>
  <span class="pl-c1">template</span>: <span class="pl-s">'&lt;h1&gt;Dashboard App&lt;/h1&gt;'</span><span class="pl-kos">,</span>
  <span class="pl-c1">directives</span>: <span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">inputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">outputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">pipes</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>

<span class="pl-k">export</span> <span class="pl-k">class</span> <span class="pl-v">Dashboard</span> <span class="pl-kos">{</span> <span class="pl-kos">}</span></pre></div>
<p dir="auto">components/about</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import {Component} from 'angular2/core';
import {Router} from 'angular2/router';
@Component({
  selector: 'about',
  template: `
  &lt;h2&gt;About&lt;/h2&gt;
  &lt;button (click)=&quot;goBack()&quot;&gt;Go Back&lt;/button&gt;

  `,
  directives: [],
  inputs:[],
  outputs:[],
  pipes:[]
})

export class About {
  from;
  constructor(route:Router){
    this.router = route;
  }
  routerOnActivate(to, from) {
    this.from = from;
    console.log('About: ', to, from);
  }

  goBack() {
    console.log(this.from);
    this.router.navigateByInstruction(this.from);
  }
 }"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Component</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/core'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Router</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/router'</span><span class="pl-kos">;</span>
@<span class="pl-v">Component</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">selector</span>: <span class="pl-s">'about'</span><span class="pl-kos">,</span>
  <span class="pl-c1">template</span>: <span class="pl-s">`</span>
<span class="pl-s">  &lt;h2&gt;About&lt;/h2&gt;</span>
<span class="pl-s">  &lt;button (click)="goBack()"&gt;Go Back&lt;/button&gt;</span>
<span class="pl-s"></span>
<span class="pl-s">  `</span><span class="pl-kos">,</span>
  <span class="pl-c1">directives</span>: <span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">inputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">outputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">pipes</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>

<span class="pl-k">export</span> <span class="pl-k">class</span> <span class="pl-v">About</span> <span class="pl-kos">{</span>
  <span class="pl-c1">from</span><span class="pl-kos">;</span>
  <span class="pl-en">constructor</span><span class="pl-kos">(</span><span class="pl-s1">route</span>:<span class="pl-v">Router</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">router</span> <span class="pl-c1">=</span> <span class="pl-s1">route</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
  <span class="pl-en">routerOnActivate</span><span class="pl-kos">(</span><span class="pl-s1">to</span><span class="pl-kos">,</span> <span class="pl-s1">from</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">from</span> <span class="pl-c1">=</span> <span class="pl-s1">from</span><span class="pl-kos">;</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'About: '</span><span class="pl-kos">,</span> <span class="pl-s1">to</span><span class="pl-kos">,</span> <span class="pl-s1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>

  <span class="pl-en">goBack</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">router</span><span class="pl-kos">.</span><span class="pl-en">navigateByInstruction</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
 <span class="pl-kos">}</span></pre></div>
<p dir="auto">compoents/tasks/task.component.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import {Component} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
import {TasksList} from './tasks-list.component';
@Component({
  selector: 'tasks',
  template: `
  &lt;h2&gt;Tasks&lt;/h2&gt;
  &lt;router-outlet&gt;&lt;/router-outlet&gt;

  `,
  directives: [ROUTER_DIRECTIVES],
  inputs:[],
  outputs:[],
  pipes:[]
})
@RouteConfig([
  {path: '/list', component: TasksList, name: 'List', useAsDefault: true}

])
export class Tasks {
  routerOnActivate(to, from) {
    console.log('Tasks: ', to, from);
    this.render();
  }
  render() { console.log('render fired');}
 }"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Component</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/core'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">RouteConfig</span><span class="pl-kos">,</span> <span class="pl-c1">ROUTER_DIRECTIVES</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/router'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">TasksList</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'./tasks-list.component'</span><span class="pl-kos">;</span>
@<span class="pl-v">Component</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">selector</span>: <span class="pl-s">'tasks'</span><span class="pl-kos">,</span>
  <span class="pl-c1">template</span>: <span class="pl-s">`</span>
<span class="pl-s">  &lt;h2&gt;Tasks&lt;/h2&gt;</span>
<span class="pl-s">  &lt;router-outlet&gt;&lt;/router-outlet&gt;</span>
<span class="pl-s"></span>
<span class="pl-s">  `</span><span class="pl-kos">,</span>
  <span class="pl-c1">directives</span>: <span class="pl-kos">[</span><span class="pl-c1">ROUTER_DIRECTIVES</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">inputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">outputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">pipes</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>
@<span class="pl-v">RouteConfig</span><span class="pl-kos">(</span><span class="pl-kos">[</span>
  <span class="pl-kos">{</span><span class="pl-c1">path</span>: <span class="pl-s">'/list'</span><span class="pl-kos">,</span> <span class="pl-c1">component</span>: <span class="pl-v">TasksList</span><span class="pl-kos">,</span> <span class="pl-c1">name</span>: <span class="pl-s">'List'</span><span class="pl-kos">,</span> <span class="pl-c1">useAsDefault</span>: <span class="pl-c1">true</span><span class="pl-kos">}</span>

<span class="pl-kos">]</span><span class="pl-kos">)</span>
<span class="pl-k">export</span> <span class="pl-k">class</span> <span class="pl-v">Tasks</span> <span class="pl-kos">{</span>
  <span class="pl-en">routerOnActivate</span><span class="pl-kos">(</span><span class="pl-s1">to</span><span class="pl-kos">,</span> <span class="pl-s1">from</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'Tasks: '</span><span class="pl-kos">,</span> <span class="pl-s1">to</span><span class="pl-kos">,</span> <span class="pl-s1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
  <span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'render fired'</span><span class="pl-kos">)</span><span class="pl-kos">;</span><span class="pl-kos">}</span>
 <span class="pl-kos">}</span></pre></div>
<p dir="auto">tasks/tasks-list.component.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import {Component} from 'angular2/core';
import {ROUTER_DIRECTIVES, Router} from 'angular2/router';
@Component({
  selector: 'tasks-list',
  template: `
  &lt;h3&gt;Task-List&lt;/h3&gt;
  &lt;button (click)=&quot;goBack()&quot;&gt;Go Back&lt;/button&gt;
  `,
  directives: [ROUTER_DIRECTIVES],
  inputs:[],
  outputs:[],
  pipes:[]
})

export class TasksList {
  task = {id : 1}

  from: any;

  constructor(router: Router) {
    this.router = router;
    console.log('constructor task-list');
  }

  routerOnActivate(to, from) {
    console.log('Task-List: ', to, from);
  }
  ngOnChanges(){
    console.log('list changes');
  }
  ngOnInit(){
    console.log('here');
  }

  goBack() {
    console.log(this.from);
    this.router.navigateByInstruction(this.from);
  }
 }"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-v">Component</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/core'</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-c1">ROUTER_DIRECTIVES</span><span class="pl-kos">,</span> <span class="pl-v">Router</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'angular2/router'</span><span class="pl-kos">;</span>
@<span class="pl-v">Component</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">selector</span>: <span class="pl-s">'tasks-list'</span><span class="pl-kos">,</span>
  <span class="pl-c1">template</span>: <span class="pl-s">`</span>
<span class="pl-s">  &lt;h3&gt;Task-List&lt;/h3&gt;</span>
<span class="pl-s">  &lt;button (click)="goBack()"&gt;Go Back&lt;/button&gt;</span>
<span class="pl-s">  `</span><span class="pl-kos">,</span>
  <span class="pl-c1">directives</span>: <span class="pl-kos">[</span><span class="pl-c1">ROUTER_DIRECTIVES</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">inputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">outputs</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
  <span class="pl-c1">pipes</span>:<span class="pl-kos">[</span><span class="pl-kos">]</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span>

<span class="pl-k">export</span> <span class="pl-k">class</span> <span class="pl-v">TasksList</span> <span class="pl-kos">{</span>
  <span class="pl-c1">task</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">id</span> : <span class="pl-c1">1</span><span class="pl-kos">}</span>

  <span class="pl-c1">from</span>: <span class="pl-c1">any</span><span class="pl-kos">;</span>

  <span class="pl-en">constructor</span><span class="pl-kos">(</span><span class="pl-s1">router</span>: <span class="pl-v">Router</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">router</span> <span class="pl-c1">=</span> <span class="pl-s1">router</span><span class="pl-kos">;</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'constructor task-list'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>

  <span class="pl-en">routerOnActivate</span><span class="pl-kos">(</span><span class="pl-s1">to</span><span class="pl-kos">,</span> <span class="pl-s1">from</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'Task-List: '</span><span class="pl-kos">,</span> <span class="pl-s1">to</span><span class="pl-kos">,</span> <span class="pl-s1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
  <span class="pl-en">ngOnChanges</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'list changes'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
  <span class="pl-en">ngOnInit</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">'here'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>

  <span class="pl-en">goBack</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">router</span><span class="pl-kos">.</span><span class="pl-en">navigateByInstruction</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">from</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
 <span class="pl-kos">}</span></pre></div>
<p dir="auto">index.html</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;!DOCTYPE html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;base href=&quot;/&quot; /&gt;
    &lt;meta charset=&quot;utf-8&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;
    &lt;title&gt;Ng2&lt;/title&gt;
    &lt;link rel=&quot;stylesheet&quot; href=&quot;css/main.css&quot;&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;route-test&gt;Loading...&lt;/route-test&gt;
  &lt;script src=&quot;main.js&quot;&gt;&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
"><pre class="notranslate"><span class="pl-c1">&lt;!DOCTYPE html<span class="pl-kos">&gt;</span></span>
<span class="pl-kos">&lt;</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">head</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">base</span> <span class="pl-c1">href</span>="<span class="pl-s">/</span>" /&gt;
    <span class="pl-kos">&lt;</span><span class="pl-ent">meta</span> <span class="pl-c1">charset</span>="<span class="pl-s">utf-8</span>"<span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">meta</span> <span class="pl-c1">name</span>="<span class="pl-s">viewport</span>" <span class="pl-c1">content</span>="<span class="pl-s">width=device-width, initial-scale=1</span>"<span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">title</span><span class="pl-kos">&gt;</span>Ng2<span class="pl-kos">&lt;/</span><span class="pl-ent">title</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">link</span> <span class="pl-c1">rel</span>="<span class="pl-s">stylesheet</span>" <span class="pl-c1">href</span>="<span class="pl-s">css/main.css</span>"<span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">head</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">route-test</span><span class="pl-kos">&gt;</span>Loading...<span class="pl-kos">&lt;/</span><span class="pl-ent">route-test</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">script</span> <span class="pl-c1">src</span>="<span class="pl-s">main.js</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">html</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto"><strong>Case:</strong> Create a timed observable and test its behaviour using <code class="notranslate">fakeAsync</code>/<code class="notranslate">tick</code>.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="describe(&quot;failed test&quot;, () =&gt; {
   it(&quot;rxjs delay&quot;, inject([], fakeAsync(() =&gt; {
       const obs = Rx.Observable.of(&quot;message&quot;).delay(1000);
       let result = &quot;&quot;;

       obs.subscribe(val =&gt; result = val);

       tick(2000);

       expect(result).toBe(&quot;message&quot;);
    })));
});"><pre class="notranslate"><code class="notranslate">describe("failed test", () =&gt; {
   it("rxjs delay", inject([], fakeAsync(() =&gt; {
       const obs = Rx.Observable.of("message").delay(1000);
       let result = "";

       obs.subscribe(val =&gt; result = val);

       tick(2000);

       expect(result).toBe("message");
    })));
});
</code></pre></div>
<p dir="auto"><strong>Result:</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Expected '' to be 'message'.
    at example.spec.js:78:34
    at testing.dev.js:1366:22
    at Zone.run (angular2-polyfills.js:1243:24)
    at testing.dev.js:1365:31
Failed: 1 timer(s) still in the queue.
Error: 1 timer(s) still in the queue.
    at new BaseException (angular2.dev.js:7385:21)
    at testing.dev.js:1374:15
    at FunctionWrapper.apply (angular2.dev.js:327:17)
    at FunctionWithParamTokens.execute (testing.dev.js:1947:37)
    at TestInjector.execute (testing.dev.js:1868:17)
    at Object.&lt;anonymous&gt; (testing.dev.js:2006:44)"><pre class="notranslate"><code class="notranslate">Expected '' to be 'message'.
    at example.spec.js:78:34
    at testing.dev.js:1366:22
    at Zone.run (angular2-polyfills.js:1243:24)
    at testing.dev.js:1365:31
Failed: 1 timer(s) still in the queue.
Error: 1 timer(s) still in the queue.
    at new BaseException (angular2.dev.js:7385:21)
    at testing.dev.js:1374:15
    at FunctionWrapper.apply (angular2.dev.js:327:17)
    at FunctionWithParamTokens.execute (testing.dev.js:1947:37)
    at TestInjector.execute (testing.dev.js:1868:17)
    at Object.&lt;anonymous&gt; (testing.dev.js:2006:44)
</code></pre></div>
<p dir="auto"><strong>Expected:</strong> Observable to resolve to completion since the time simulated by tick is greater than the observable's delay.</p>
<p dir="auto"><strong>Version:</strong> angular2@2.0.0-beta.8, rxjs@5.0.0-beta2<br>
<strong>Platform:</strong> karma@0.13.21, jasmine-core@2.3.2, chrome@48.0.2564, typescript@1.8.2</p>