Question

我正在构建适用于iOS和iOS的Ionic App Android和目前为止，我有一个表单，用户可以上传或拍照，然后填写一些其他信息并提交表格。

我的问题：

目前，当用户进入输入以输入一些额外的文本时，键盘底部有一个go按钮。如果用户点击了这个＆＃39; Go＆＃39;按钮它会尝试提交表单，同时打开我的choosePicture()函数。

单击时会发生什么 Go button - it opens the Library

HTML

<ion-item class="file-upload">
    <button  class="btn btn-block" ion-button (click)="choosePhoto()">Choose a Photo</button>
    <span class="sep"></span>
    <button class="btn btn-block" ion-button (click)="takePicture()">Take a Picture</button>
    <div class="uploaded-img">
        <input type="file" value="" formControlName="hazardImage" hidden />
        <span class="img-desc">Please Take or Upload an Image.</span>
        <div class="img-picked" *ngIf="base64Img">
            <img [src]="base64Img" alt="Hazard Picture" />
            <!-- <img src="http://placehold.it/300x300" alt="Test Image" /> -->
        </div>
    </div>
</ion-item>

<small class="small-title">Where is the Hazard Location? (required)</small>
<ion-item class="input-box">
    <ion-input type="text" formControlName="hazardLocation" [class.invalid]="!hazardForm.controls.hazardLocation.valid && (hazardForm.controls.hazardLocation.dirty || submitAttempt)"></ion-input>
</ion-item>

TypeScript：

choosePhoto()
{
    this.Camera.getPicture({
        quality: 50,
        destinationType: this.Camera.DestinationType.DATA_URL,
        encodingType: this.Camera.EncodingType.JPEG,
        sourceType: this.Camera.PictureSourceType.PHOTOLIBRARY,
        allowEdit: true
    }).then((ImageData) => {
        // console.log(ImageData);
        this.base64Img = ImageData;
        this.hazardForm.patchValue({
            hazardImage: this.base64Img
        });
    }, (err) => {
        console.log(err);
    })
}

我不明白为什么Go按钮会打开选择照片的功能：/

Answer 1

您可以使用以下命令修改“Go”键盘按钮的行为：

pickerView

Answer 2

您已将“危险位置”的<input>定义为表单，因为存在formControlName="hazardLocation"属性。这使得Go或表单提交按钮出现在移动键盘中。

相反，你应该把它作为像这样的普通输入字段

<input [(ngModel)]="hazardLocation">

Ionic 2 - 在键盘输入'Go'字段做两件事

2 个答案: