mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 03:32:21 +08:00
docs(demos): add search demo
This commit is contained in:
@ -97,6 +97,7 @@ export function getPageFor(hash) {
|
|||||||
'segment': inputs.SegmentPage,
|
'segment': inputs.SegmentPage,
|
||||||
'select': inputs.SelectPage,
|
'select': inputs.SelectPage,
|
||||||
'switch': inputs.SwitchPage,
|
'switch': inputs.SwitchPage,
|
||||||
|
'search': inputs.SearchPage,
|
||||||
|
|
||||||
'inputs': labels.BasicPage,
|
'inputs': labels.BasicPage,
|
||||||
'fixed-inline-labels': labels.FixedInlinePage,
|
'fixed-inline-labels': labels.FixedInlinePage,
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
export * from './checkbox/pages';
|
export * from './checkbox/pages';
|
||||||
export * from './radio/pages';
|
export * from './radio/pages';
|
||||||
export * from './range/pages';
|
export * from './range/pages';
|
||||||
|
export * from './search/pages';
|
||||||
export * from './segment/pages';
|
export * from './segment/pages';
|
||||||
export * from './select/pages';
|
export * from './select/pages';
|
||||||
export * from './switch/pages';
|
export * from './switch/pages';
|
||||||
|
69
demos/component-docs/inputs/search/pages.ts
Normal file
69
demos/component-docs/inputs/search/pages.ts
Normal file
@ -0,0 +1,69 @@
|
|||||||
|
import {Page} from 'ionic/ionic';
|
||||||
|
import {forwardRef} from 'angular2/angular2';
|
||||||
|
import {AndroidAttribute} from '../../helpers';
|
||||||
|
|
||||||
|
@Page({
|
||||||
|
templateUrl: 'inputs/search/template.html',
|
||||||
|
directives: [forwardRef(() => AndroidAttribute)]
|
||||||
|
})
|
||||||
|
export class SearchPage{
|
||||||
|
constructor() {
|
||||||
|
this.searchQuery = '';
|
||||||
|
this.items = [
|
||||||
|
'Amsterdam',
|
||||||
|
'Bogota',
|
||||||
|
'Buenos Aires',
|
||||||
|
'Cairo',
|
||||||
|
'Dhaka',
|
||||||
|
'Edinburgh',
|
||||||
|
'Geneva',
|
||||||
|
'Genoa',
|
||||||
|
'Glasglow',
|
||||||
|
'Hanoi',
|
||||||
|
'Hong Kong',
|
||||||
|
'Islamabad',
|
||||||
|
'Istanbul',
|
||||||
|
'Jakarta',
|
||||||
|
'Kiel',
|
||||||
|
'Kyoto',
|
||||||
|
'Le Havre',
|
||||||
|
'Lebanon',
|
||||||
|
'Lhasa',
|
||||||
|
'Lima',
|
||||||
|
'London',
|
||||||
|
'Los Angeles',
|
||||||
|
'Madrid',
|
||||||
|
'Manila',
|
||||||
|
'New York',
|
||||||
|
'Olympia',
|
||||||
|
'Oslo',
|
||||||
|
'Panama City',
|
||||||
|
'Peking',
|
||||||
|
'Philadelphia',
|
||||||
|
'San Francisco',
|
||||||
|
'Seoul',
|
||||||
|
'Taipeh',
|
||||||
|
'Tel Aviv',
|
||||||
|
'Tokio',
|
||||||
|
'Uelzen',
|
||||||
|
'Washington'
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
getItems() {
|
||||||
|
var q = this.searchQuery;
|
||||||
|
if(q.trim() == '') {
|
||||||
|
return this.items;
|
||||||
|
}
|
||||||
|
return this.items.filter((v) => {
|
||||||
|
if(v.toLowerCase().indexOf(q.toLowerCase()) >= 0) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
14
demos/component-docs/inputs/search/template.html
Normal file
14
demos/component-docs/inputs/search/template.html
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<ion-navbar *navbar hide-back-button class="android-attr">
|
||||||
|
<ion-title>
|
||||||
|
Search
|
||||||
|
</ion-title>
|
||||||
|
</ion-navbar>
|
||||||
|
|
||||||
|
<ion-content>
|
||||||
|
<ion-searchbar [(ng-model)]="searchQuery"></ion-searchbar>
|
||||||
|
<ion-list #list>
|
||||||
|
<ion-item *ng-for="#item of getItems()">
|
||||||
|
{{item}}
|
||||||
|
</ion-item>
|
||||||
|
</ion-list>
|
||||||
|
</ion-content>
|
Reference in New Issue
Block a user