Ionic TextFile Löschtaste Tastaturverhalten iOS

Question

Ich habe eine Texteingabe in meiner Ionic-Anwendung, die zwei Tasten im selben Bereich hat. Die erste Schaltfläche wird verwendet, um eine Suche durchzuführen, und die zweite wird verwendet, um die Texteingabe zu löschen. Ich sehe seltsames Verhalten, wenn ich auf die Schaltfläche zum Löschen klicke, die Texteingabe wird gelöscht und die Tastatur erscheint wieder, aber das Textfeld hat keinen Fokus.

Kann mir jemand helfen, damit ich sicherstellen kann, dass die Texteingabe nach dem Löschen des Texts noch scharf ist? Vielen Dank.

<form class="list"> 
 
    <span class="item item-input-inset"> 
 
    <label class="item-input-wrapper address-label" name="addressLabel"> 
 
     <i class="icon ion-ios-search placeholder-icon" ng-show="!address.length"></i> 
 
     <input type="text" class="address-input" placeholder="Search By Address" ng-model="address" autocomplete="off" autocorrect="off" autocapitalize="off"> 
 
    </label> 
 
    <button type="submit" id="button1" class="button button-small custom-btn ion-search" ng-click="search(address)" ng-show="address.length"></button> 
 
    <button ng-click="address = ''" class="button button-small custom-btn ion-close-round" ng-show="address.length"></button> 
 
    </span> 
 
</form>

Answer 1

Werfen Sie einen Blick auf diesen Beitrag aus den ionischen Rahmen Foren. Scheint so, als würde das funktionieren und dir ein nativeres Aussehen geben.

<div class="list list-inset"> 
    <div class="item item-input"> 
     <input type="text" placeholder="mail stop" 
      name="mail_stop_name" 
     > 
     <i class="icon ion-ios-close placeholder-icon" 
     data-tap-disabled="true" on-touch="formData.mail_stop_name = ''"></i> 
    </div> 
</div> 

Ref: https://forum.ionicframework.com/t/clear-button-inside-input-causes-input-to-loose-focus/17016