Đầu vào Tìm kiếm Ionic trong thanh tiêu đề

Question

Tôi không hiểu tại sao văn bản đầu vào hơi bị lệch xuống đáy khi được hiển thị trong trình mô phỏng IOS và trong Trình duyệt được định vị đúng.

Mã này rất đơn giản:

<ion-nav-title> 
    <div class="bar bar-header item-input-inset"> 
     <label class="item-input-wrapper"> 
      <i class="icon ion-ios-search placeholder-icon"></i> 
      <input ng-model="search_text" type="text" placeholder="Search..." focus-me my-enter="search_model(search_text)" autofocus> 
     </label> 
    </div> 
</ion-nav-title> 

Ở đây tôi đính kèm hai ảnh chụp nhanh (trong trình duyệt và trong IOS giả):

Có gì hapenning?

Answer 1

Thanh tiêu đề không được nằm trong tiêu đề ion-nav. Trên thực tế, nếu bạn sử dụng một div với class = "bar header-bar", bạn có thể khai báo một tiêu đề bên trong bằng cách sử dụng class = "title". Ví dụ:

<div class="bar bar-header bar-light"> 
    <h1 class="title">bar-light</h1> 
</div> 

Xóa thẻ tiêu đề ion-nav sẽ khắc phục sự cố.

Answer 2

Chỉ cần thay đổi tiêu đề ion-nav thành ion-nav-bar