fix(item-sliding): item-left/item-right ng-contents

Closes #287
This commit is contained in:
Adam Bradley
2015-10-15 15:08:00 -05:00
parent dd15279227
commit 970abdf08c
3 changed files with 36 additions and 10 deletions

View File

@ -36,10 +36,11 @@ import {CSS, raf} from 'ionic/util/dom';
template:
'<ng-content select="ion-item-options"></ng-content>' +
'<ion-item-sliding-content>' +
'<ng-content select="[item-left]"></ng-content>' +
'<ng-content select="[item-right]"></ng-content>' +
'<ion-item-content>' +
'<ng-content></ng-content>'+
'</ion-item-content>' +
'<ng-content select="[item-right]"></ng-content>' +
'</ion-item-sliding-content>',
directives: [NgIf]
})

View File

@ -8,12 +8,12 @@ class E2EApp {
constructor() {
setTimeout(() => {
this.shouldShow = true;
}, 5000);
}, 10);
}
getItems() {
console.log('getItems');
return [1,2,3,4];
return [0,1];
}
}

View File

@ -23,7 +23,7 @@
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding text-wrap detail-push>
<ion-item-sliding text-wrap detail-push *ng-if="shouldShow">
<h3>Ben Sperry</h3>
<p>
I like paper
@ -34,21 +34,46 @@
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding text-wrap detail-push *ng-if="shouldShow">
<h3>Max Lynch</h3>
<p>
Hey do you want to go to the game tonight?
</p>
<ion-item-sliding>
<icon mail item-left></icon>
One Line w/ Icon, div only text
<ion-item-options>
<button primary>Archive</button>
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding>
<ion-avatar item-left>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
</ion-avatar>
One Line w/ Avatar, div only text
<ion-item-options>
<button primary>Archive</button>
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding>
<ion-thumbnail item-left>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
</ion-thumbnail>
<h2>Two Lines w/ Thumbnail, H2 Header</h2>
<p>Paragraph text.</p>
<ion-item-options>
<button primary>Archive</button>
</ion-item-options>
</ion-item-sliding>
<ion-item-sliding text-wrap detail-push *ng-for="#item of getItems()">
<h3>{{item}}</h3>
<h3>ng-for {{item}}</h3>
<ion-item-options>
<button primary>Archive</button>
</ion-item-options>
</ion-item-sliding>
</ion-list>
<style>
img {
height: 100px;
}
</style>