Ionic Input 获得焦点和内容全选

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/chelen_jak/article/details/88314252

一、获得焦点
html

        <ion-item class="amt-input">
            <ion-label>¥</ion-label>
            <ion-input #amtInput type="number" formControlName="amt" placeholder="请输入支付金额"></ion-input>
        </ion-item>

ts

    @ViewChild("amtInput") amtInput: any;

    ngAfterViewInit() {
        this.setFocus();
    }

    setFocus() {
        setTimeout(() => {
            if (this.amtInput && !this.amtInput.isFocus()) {
                this.amtInput.setFocus();
            }
        }, 500);
    }

二、Input内容全选 中
html

<ion-item class="amt-input">
    <ion-input type="number" formControlName="qty" placeholder="请输入销售数量" (ionFocus)="selectAll($event)"></ion-input>
</ion-item>

ts

    selectAll(e) {
        e._native.nativeElement.select();
    }

 效果图:



 

猜你喜欢

转载自blog.csdn.net/chelen_jak/article/details/88314252