Ionic 2 android 显示布局和功能

Ionic 2 android display layout and functions

我正在 Huawei G535 上测试我的应用程序,布局错位,按钮无法点击。我正在使用离子 2。 我在我的模拟器和浏览器上测试了这个,一切都很好。 我没有另一个 phone 来测试它,但如果我的 phone 有问题,那么我认为它也会影响其他 phone。

Android 信息(如果有帮助)

我页面的代码。

<ion-header>
  <ion-navbar color="primary">
    <ion-title>
      Title
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <ion-list no-lines>
    <ion-item *ngFor="let item of items | async">
      <ion-avatar item-left>
        <img src="{{item.image}}"/>
      </ion-avatar>
      <h1>{{item.title}}</h1>
      <button ion-button clear item-right large (click)="showItem(item)">
        <ion-icon name="arrow-dropright"></ion-icon>
      </button>
    </ion-item>
  </ion-list>

</ion-content>

环顾四周后,我发现问题可能是过时的离子版本。 所以我将我的离子应用程序更新到最新版本。我现在可以使用按钮导航到我的华为 phone 上的另一个页面。但是按钮和位置仍然是错误的。该列表显示为压缩列表,全部位于 phone 的左侧,导航栏中的标题没有边距。 当我到达另一页时,后退箭头按钮位于导航栏标题上方,link 按钮不起作用。

如您所见,它与此处显示的不同http://ionicframework.com/docs/v2/components/#thumbnail-list

有什么可能出错的建议吗? 非常感谢

更新 我创建了一个新的 ionic 2,只将 home.html 文件更改为列表。但这是相同的结果。 我没有收到任何控制台错误。这似乎是离子应用程序的填充和边距。

Check in official website 。它说 Ionic 2 支持可以追溯到 4.4。

如果你想支持更靠后,你将不得不使用人行横道。 有用的链接:

1.ionic blog

2.A tutorial link