diff --git a/demo-shell-ng2/app/app.routes.ts b/demo-shell-ng2/app/app.routes.ts
index 2d6fd318ee..5f791bf8b5 100644
--- a/demo-shell-ng2/app/app.routes.ts
+++ b/demo-shell-ng2/app/app.routes.ts
@@ -40,6 +40,7 @@ export const routes: RouterConfig = [
     { path: 'login', component: LoginDemoComponent },
     { path: 'search', component: SearchComponent },
     { path: 'activiti', component: ActivitiDemoComponent },
+    { path: 'activiti/appId/:appId', component: ActivitiDemoComponent },
     { path: 'activiti/tasks/:id', component: FormViewer },
     { path: 'activiti/tasksnode/:id', component: FormNodeViewer },
     { path: 'webscript', component: WebscriptComponent },
diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.html b/demo-shell-ng2/app/components/activiti/activiti-demo.component.html
index 67af66d70b..f94e5cec19 100644
--- a/demo-shell-ng2/app/components/activiti/activiti-demo.component.html
+++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.html
@@ -13,7 +13,7 @@
                 <div class="mdl-grid">
                     <div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
                         <span>Task Filters</span>
-                        <activiti-filters (filterClick)="onTaskFilterClick($event)"></activiti-filters>
+                        <activiti-filters [appId]="appId" (filterClick)="onTaskFilterClick($event)"></activiti-filters>
                     </div>
                     <div class="mdl-cell mdl-cell--3-col task-column mdl-shadow--2dp">
                         <span>Task List</span>
diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts b/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts
index 82430d2b98..7a62f9dd78 100644
--- a/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts
+++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts
@@ -19,6 +19,8 @@ import { Component, AfterViewChecked, ViewChild, Input } from '@angular/core';
 import { ALFRESCO_TASKLIST_DIRECTIVES } from 'ng2-activiti-tasklist';
 import { ACTIVITI_PROCESSLIST_DIRECTIVES } from 'ng2-activiti-processlist';
 import { ActivitiForm } from 'ng2-activiti-form';
+import { ActivatedRoute } from '@angular/router';
+import { Subscription } from 'rxjs/Rx';
 
 declare let __moduleName: string;
 declare var componentHandler;
@@ -55,6 +57,8 @@ export class ActivitiDemoComponent implements AfterViewChecked {
     taskFilter: any;
     processFilter: any;
 
+    private sub: Subscription;
+
     @Input()
     appId: string;
 
@@ -70,7 +74,7 @@ export class ActivitiDemoComponent implements AfterViewChecked {
         return this.currentChoice === 'task-list';
     }
 
-    constructor() {
+    constructor(private route: ActivatedRoute) {
         this.taskSchemaColumns = [
             {type: 'text', key: 'name', title: 'Name', cssClass: 'full-width name-column', sortable: true}
             // {type: 'text', key: 'created', title: 'Created', sortable: true}
@@ -80,6 +84,16 @@ export class ActivitiDemoComponent implements AfterViewChecked {
         ];
     }
 
+    ngOnInit() {
+        this.sub = this.route.params.subscribe(params => {
+            this.appId = params['appId'];
+        });
+    }
+
+    ngOnDestroy() {
+        this.sub.unsubscribe();
+    }
+
     onTaskFilterClick(event: any) {
         this.taskFilter = event;
         this.activititasklist.load(this.taskFilter.filter);