Bark park

src/components/app/test/barkpark/main.js

@@ -1,5 +1,5 @@
 import {bootstrap} from 'angular2/core'
-import {Component, Template, Parent} from 'angular2/angular2'
+import {For, Component, Template, Parent} from 'angular2/angular2'
 import {FormBuilder, Validators, FormDirectives, CongrolGroup} from 'angular2/forms';
 
 import {Log} from 'ionic2/util'
@@ -93,11 +93,15 @@ export class AppPage {
 @Component({ selector: 'stream-tab' })
 @Template({
   url: 'pages/tabs/home.html',
-  directives: [View, Content]
+  directives: [For, View, Content]
 })
 class StreamTab {
   constructor(navPane: NavPane) {
-    this.navPane = navPane
+    this.navPane = navPane;
+    this.posts = [
+      {'title': 'Just barked my first bark'},
+      {'title': 'Went poopy' }
+    ];
   }
   selectPost(post) {
     this.navPane.push(PostDetail, {
@@ -122,36 +126,10 @@ class PostDetail {
   }
 }
 
-//
-// tab 2
-//
-@Component({ selector: 't2p1' })
-@Template({
-  inline: `
-    <ion-aside side="left" [content]="view">
-      Left aside for Tab 2 Page 1
-    </ion-aside>
-    <ion-view nav-title="Tab 2 Page 1" #view>
-      <ion-content class="padding">
-        <p>Tab 2 Page 1.</p>
-        <button class="button button-primary" (click)="next()">
-          Go to Tab 2 Page 2 (push)
-        </button>
-        <br/><span style="color:red">I have got an aside on the left.</span>
-        <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-      </ion-content>
-    </ion-view>
-  `,
-  directives: [View, Aside, Content]
-})
-class Tab2Page1 {
-  constructor(navPane: NavPane) {
-    this.navPane = navPane
-  }
-  next() {
-  }
-}
 
+/**
+ * Main app entry point
+ */
 @Component({ selector: '[ion-app]' })
 @Template({
   directives: [NavViewport],

src/components/app/test/barkpark/pages/app.html

@@ -1,9 +1,6 @@
 <ion-tabs>
 
-  <ion-tab [initial]="tab1Initial" tab-title="Tab 1">
-  </ion-tab>
-
-  <ion-tab [initial]="tab2Initial" tab-title="Tab 2">
+  <ion-tab [initial]="streamTab" tab-title="Stream">
   </ion-tab>
 
 </ion-tabs>

src/components/app/test/barkpark/pages/tabs/home.html

@@ -1,7 +1,9 @@
 <ion-view nav-title="Stream">
   <ion-content class="padding">
+    <h2>Posts</h2>
     <ion-list>
-      <ion-item *for="post of posts" (click)="selectPost(post)">
+      <ion-item *for="#post of posts" (click)="selectPost(post)">
+        {{post.title}}
       </ion-item>
     </ion-list>
   </ion-content>

src/components/nav-pane/nav-pane.js

@@ -1,23 +1,15 @@
-import {DynamicComponent, Parent, NgElement, bind} from 'angular2/angular2'
+import {DynamicComponent, Parent, NgElement} from 'angular2/angular2'
 import {Optional} from 'angular2/src/di/annotations'
 import {NavViewport} from 'ionic2/components/nav-viewport/nav-viewport'
 import {Tab} from 'ionic2/components/tabs/tab'
 import {PrivateComponentLoader} from 'angular2/src/core/compiler/private_component_loader'
 import {PrivateComponentLocation} from 'angular2/src/core/compiler/private_component_location'
-import {extend} from 'ionic2/util'
-
-class NavData = {
-  constructor(data = {}) {
-    extend(this, data)
-  }
-} 
 
 @DynamicComponent({
   selector: '.nav-pane',
   bind: {
     item: 'item'
-  },
-  services: [NavData]
+  }
 })
 export class NavPane {
   constructor(