javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 03:32:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

3
ionic/components/item/item-sliding.ts
View File

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

4
ionic/components/item/test/sliding/index.ts
View File

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

39
ionic/components/item/test/sliding/main.html
View File

@ -23,7 +23,7 @@
</ion-item-options> </ion-item-options>
</ion-item-sliding> </ion-item-sliding>
<ion-item-sliding text-wrap detail-push> <ion-item-sliding text-wrap detail-push *ng-if="shouldShow">
<h3>Ben Sperry</h3> <h3>Ben Sperry</h3>
<p> <p>
I like paper I like paper
@ -34,21 +34,46 @@
</ion-item-options> </ion-item-options>
</ion-item-sliding> </ion-item-sliding>
<ion-item-sliding text-wrap detail-push *ng-if="shouldShow"> <ion-item-sliding>
<h3>Max Lynch</h3> <icon mail item-left></icon>
<p> One Line w/ Icon, div only text
Hey do you want to go to the game tonight? <ion-item-options>
</p> <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> <ion-item-options>
<button primary>Archive</button> <button primary>Archive</button>
</ion-item-options> </ion-item-options>
</ion-item-sliding> </ion-item-sliding>
<ion-item-sliding text-wrap detail-push *ng-for="#item of getItems()"> <ion-item-sliding text-wrap detail-push *ng-for="#item of getItems()">
<h3>{{item}}</h3> <h3>ng-for {{item}}</h3>
<ion-item-options> <ion-item-options>
<button primary>Archive</button> <button primary>Archive</button>
</ion-item-options> </ion-item-options>
</ion-item-sliding> </ion-item-sliding>
</ion-list> </ion-list>
<style>
img {
height: 100px;
}
</style>