mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-10 00:27:41 +08:00
Misc 6
This commit is contained in:
@ -498,7 +498,7 @@ export class DateTime extends BaseInput<DateTimeData> implements AfterContentIni
|
||||
picker.addButton({
|
||||
text: this.cancelText,
|
||||
role: 'cancel',
|
||||
handler: () => this.ionCancel.emit(null)
|
||||
handler: () => this.ionCancel.emit(this)
|
||||
});
|
||||
picker.addButton({
|
||||
text: this.doneText,
|
||||
|
||||
@ -287,8 +287,8 @@ export class Searchbar extends BaseInput<string> {
|
||||
* Update the Searchbar input value when the input changes
|
||||
*/
|
||||
inputChanged(ev: any) {
|
||||
this.ionInput.emit(ev);
|
||||
this.value = ev.target.value;
|
||||
this.ionInput.emit(ev);
|
||||
}
|
||||
|
||||
/**
|
||||
@ -331,6 +331,7 @@ export class Searchbar extends BaseInput<string> {
|
||||
let value = this._value;
|
||||
if (isPresent(value) && value !== '') {
|
||||
this.value = ''; // DOM WRITE
|
||||
this.ionInput.emit(ev);
|
||||
}
|
||||
}, 16 * 4);
|
||||
this._shouldBlur = false;
|
||||
|
||||
@ -1,33 +1,33 @@
|
||||
<ion-content>
|
||||
<h5 padding-left> Search - Default </h5>
|
||||
<ion-searchbar [(ngModel)]="defaultSearch" type="tel" showCancelButton debounce="500" (ionInput)="triggerInput($event)" (ionBlur)="inputBlurred($event)" (ionFocus)="inputFocused($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
<ion-searchbar [(ngModel)]="defaultSearch" type="tel" showCancelButton debounce="500" (ionChange)="changedInput($event)" (ionInput)="triggerInput($event)" (ionBlur)="inputBlurred($event)" (ionFocus)="inputFocused($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
|
||||
<h5 padding-left> Search - Animated </h5>
|
||||
<ion-searchbar animated="true" showCancelButton debounce="500" (ionInput)="triggerInput($event)" (ionBlur)="inputBlurred($event)" (ionFocus)="inputFocused($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
<ion-searchbar animated="true" showCancelButton debounce="500" (ionChange)="changedInput($event)" (ionInput)="triggerInput($event)" (ionBlur)="inputBlurred($event)" (ionFocus)="inputFocused($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
|
||||
<p padding-left>
|
||||
defaultSearch: <b>{{ defaultSearch }}</b>
|
||||
</p>
|
||||
|
||||
<h5 padding-left> Search - Custom Placeholder </h5>
|
||||
<ion-searchbar [autocorrect]="isAutocorrect" showCancelButton="true" [autocomplete]="isAutocomplete" [spellcheck]="isSpellcheck" type="number" [(ngModel)]="customPlaceholder" (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)" placeholder="Filter Schedules"></ion-searchbar>
|
||||
<ion-searchbar [autocorrect]="isAutocorrect" showCancelButton="true" [autocomplete]="isAutocomplete" [spellcheck]="isSpellcheck" type="number" placeholder="Filter Schedules" [(ngModel)]="customPlaceholder" (ionChange)="changedInput($event)" (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
|
||||
<p padding-left>
|
||||
customPlaceholder: <b>{{ customPlaceholder }}</b>
|
||||
</p>
|
||||
|
||||
<h5 padding-left> Search - No Cancel Button </h5>
|
||||
<ion-searchbar autocorrect="off" autocomplete="off" spellcheck="true" type="text" [(ngModel)]="defaultCancel" (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)" showCancelButton="false"></ion-searchbar>
|
||||
<ion-searchbar autocorrect="off" autocomplete="off" spellcheck="true" type="text" [(ngModel)]="defaultCancel" showCancelButton="false" (ionChange)="changedInput($event)" (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
|
||||
<p padding-left>
|
||||
defaultCancel: <b>{{ defaultCancel }}</b>
|
||||
</p>
|
||||
|
||||
<h5 padding-left> Search - Custom Cancel Button Danger </h5>
|
||||
<ion-searchbar (ionInput)="triggerInput($event)" showCancelButton (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)" cancelButtonText="Really Long Cancel" color="danger"></ion-searchbar>
|
||||
<ion-searchbar showCancelButton cancelButtonText="Really Long Cancel" color="danger" (ionChange)="changedInput($event)" (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
|
||||
<h5 padding-left> Search - Value passed </h5>
|
||||
<ion-searchbar value="mysearch" showCancelButton (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)" cancelButtonText="Really Long Cancel" color="dark"></ion-searchbar>
|
||||
<ion-searchbar value="mysearch" cancelButtonText="Really Long Cancel" color="dark" showCancelButton (ionChange)="changedInput($event)" (ionInput)="triggerInput($event)" (ionCancel)="onCancelSearchbar($event)" (ionClear)="onClearSearchbar($event)"></ion-searchbar>
|
||||
|
||||
<h5 padding-left> Search - Mode iOS</h5>
|
||||
<ion-searchbar mode="ios" animated="true" showCancelButton placeholder="Search"></ion-searchbar>
|
||||
|
||||
@ -19,23 +19,27 @@ export class RootPage {
|
||||
}
|
||||
|
||||
onClearSearchbar(ev: any) {
|
||||
console.log('ionClear', ev.value);
|
||||
console.log('ionClear', ev);
|
||||
}
|
||||
|
||||
onCancelSearchbar(ev: any) {
|
||||
console.log('ionCancel', ev.value);
|
||||
console.log('ionCancel', ev);
|
||||
}
|
||||
|
||||
triggerInput(ev: any) {
|
||||
console.log('ionInput', ev.value);
|
||||
console.log('ionInput', ev);
|
||||
}
|
||||
|
||||
changedInput(ev: any) {
|
||||
console.log('ionChange', ev);
|
||||
}
|
||||
|
||||
inputBlurred(ev: any) {
|
||||
console.log('ionBlur', ev.value);
|
||||
console.log('ionBlur', ev);
|
||||
}
|
||||
|
||||
inputFocused(ev: any) {
|
||||
console.log('ionFocus', ev.value);
|
||||
console.log('ionFocus', ev);
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
|
||||
Reference in New Issue
Block a user