gpt4 book ai didi

javascript - 如何在 Ionic 中的 ionic 内容中插入标签

转载 作者:可可西里 更新时间:2023-11-01 01:47:10 24 4
gpt4 key购买 nike

始终使用很棒的框架 Ionic 来开发我的移动应用程序。一切似乎都正常。

我想在我的应用程序中添加一些特别的东西。我想在 ion-content 中添加标签。

我正在使用按钮栏选项卡。我不确定这是否是正确的解决方案。

我还想让您知道,我已经在我的应用程序中使用了选项卡工具,因此在我的 app.js 中我确实有一些用于导航选项卡的代码。所以我不知道如何为另一个页面添加另一个。

我的代码:

CODEPEN

这是我想要的:

Screenshot of what I want

这里是我的一些代码:

<body>
<div>
<ion-header-bar class="bar-stable">
<button class="button button-clear button-positive" href="index.html">Retour</button>

<h1 class="title">Détails</h1>

</ion-header-bar>
<ion-content>

<div class="item item-divider" style="height:45px">
<div style="display:inline-block; left:10px; position:absolute;">
<h5>Competiton</h5>
<h5>14th journey</h5>
</div>
<div style="display:inline-block; right:10px; position:absolute;">
<h5>25 MAI 2015</h5>
<h5>18:00</h5>
</div>
</div>
<div class="item item-text-wrap" style="height:100px">
<img src="http://upload.wikimedia.org/wikipedia/en/6/6a/Zte_Football_Club_Logo_90.png" style="width:55px; height:55px; position:absolute; left:10px; top:12px">
<img src="http://upload.wikimedia.org/wikipedia/en/6/6a/Zte_Football_Club_Logo_90.png" style="width:55px; height:55px; position:absolute; right:10px; top:12px" >
<h4 style="position:absolute; left:10px; top:70px">ASROME</h4> <h4 style="position:absolute; right:10px; top:70px">LAZIO</h4>
<h4 style="position:absolute; left:150px; top:35px">3</h4> <h4 style="position:absolute; right:150px; top:35px">2</h4>
</div>

<div class="button-bar">
<a class="button" tab-state ui-sref="home">Résumé</a>
<a class="button" tab-state ui-sref="contact">Composition</a>

</div>

</div>
</body>

最佳答案

我遇到了同样的问题,我是这样解决的。

<ion-view view-title="Tabs">
<ion-pane>
<ion-tabs class="tabs-top">

<!-- Tab 1 -->
<ion-tab title="Tab 1" href="#/tab/tab1">
<ion-nav-view name="tab-tab1">
<ion-content>
Tab 1 content
</ion-content>

</ion-nav-view>
</ion-tab>


<!-- Tab 2 -->
<ion-tab title="Tab 2" href="#/tab/tab2">
<ion-nav-view name="tab-tab2">
<ion-content>
Tab 2 content
</ion-content>
</ion-nav-view>
</ion-tab>
</ion-tabs>

</ion-pane>
</ion-view>

关于javascript - 如何在 Ionic 中的 ionic 内容中插入标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30460750/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com