html页面

<ion-content padding>

    <ion-segment [(ngModel)]="tabs">
<ion-segment-button value="gatewaySignal">网关接受信号</ion-segment-button>
<ion-segment-button value="taskType">任务类型</ion-segment-button>
<ion-segment-button value="testTask">测试任务</ion-segment-button>
<ion-segment-button value="lockRecord">门锁记录</ion-segment-button>
</ion-segment> <div [ngSwitch]="tabs">
<div *ngSwitchCase="'gatewaySignal'">
1
</div>
<div *ngSwitchCase="'taskType'">
2
</div>
<div *ngSwitchCase="'testTask'">
3
</div>
<div *ngSwitchCase="'lockRecord'">
4
</div>
</div> </ion-content>

ts文件里

public tabs = 'gatewaySignal';

 

ionic3创建选项卡的更多相关文章

  1. EasyUI创建选项卡并判断是否打开

    //创建选项卡:判断选项卡是否打开,如果以打开则定位到选项卡,否则创建 function addPanel(title) { var bol = $('#main_tabs').tabs('exist ...

  2. MFC 创建选项卡

    1.创建三个选项卡Dialog窗体,ID分别改为porpTest1.porpTest2.porpTest3 2.创建三个选项卡类,类名分别为CPropTest1.CPropTest2.CPropTes ...

  3. ExtJS创建选项卡

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. Ionic3 创建应用(Android)

    打开CMD 通过命令行进入项目目录 创建一个App项目 ionic start myApp blank 空白App ionic start myApp tabs 导航条 ionic start myA ...

  5. Ionic3实现选项卡切换可以重新加载echarts

    要求 选项卡每切换一次,就加载对应的一个echarts 图,要有一开始的动画效果效果如下: 注意点 1.echarts要想每次都能重新加载,需要移除"_echarts_instance_&q ...

  6. ionic3 创建项目至apk打包全过程教程

    主要流程: 安装node.js  -->  安装jdk  -->  安装AndroidSDK  -->  安装cordova  -->  安装ionic -->  创建项 ...

  7. Ionic3 创建应用后,目录结构

    ionic start myApp blank (空项目) hooks --编译cordova时自定义的脚本命令,方便整合到我们的编译系统和版本控制系统中 node_modules --node各类依 ...

  8. 转载《Android-TabHost 选项卡功能用法详解》

    一. TabHost介绍 TabHost组件可以在界面中存放多个选项卡, 很多软件都使用了改组件进行设计; 1. TabHost常用组件 TabWidget : 该组件就是TabHost标签页中上部 ...

  9. Android 自学之选项卡TabHost

    选项卡(TabHost)是一种非常实用的组件,TabHost可以很方便地在窗口上放置多个标签页,每个标签页相当于获得了一个与外部容器相同大小的组建摆放区域.通过这种方式,就可以在一个容器中放置更多组件 ...

随机推荐

  1. 数据结构系列(4)之 B 树

    本文将主要讲述另一种树形结构,B 树:B 树是一种多路平衡查找树,但是可以将其理解为是由二叉查找树合并而来:它主要用于在不同存储介质之间查找数据的时候,减少 I/O 次数(因为一次读一个节点,可以读取 ...

  2. [JavaScript] 函数节流(throttle)和函数防抖(debounce)

    js 的函数节流(throttle)和函数防抖(debounce)概述 函数防抖(debounce) 一个事件频繁触发,但是我们不想让他触发的这么频繁,于是我们就设置一个定时器让这个事件在 xxx 秒 ...

  3. python -使用del语句删除对象引用

    使用del语句删除一些对象引用. 注意不是把内存地址删了,你只是删除了引用,它就变为了一个可回收的对象,内存会不定期回收. del语句的语法是: del var1[,var2[,var3[....,v ...

  4. mysql索引结构及其原理

    1.定义 索引是一种数据结果,帮助提高获取数据的速度 为了提高查找速度,有很多查询优化算法.但是每种查找算法都只能应用于特定数据结构之上. 索引就是数据库创建的满足特定查找算法的数据结构,这些数据结构 ...

  5. 如何将数据库中的值经过servlet传入到jsp页面,并且用EL表达式显示出值

    方法一:通过id查询某一数据库表中具体的行,将值封装在相应的对象中,如下面的对象Notice servlet中 String noticeId=request.getParameter("n ...

  6. Nginx实现负载均衡功能

    一.什么是Nginx? Nginx是一款轻量级的Web 服务器.反向代理服务器.电子邮件(IMAP/POP3)代理服务器. 二.Nginx的优点: 高并发连接:官方测试Nginx能够支撑5万并发连接, ...

  7. css 半圆效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. Django常见问题

    1.什么是中间件? 中间件是介于request与response处理之间的一道处理过程,相对比较轻量级,并且在全局上改变django的输入与输出. 中间件一般做认证或批量请求处理,django中的中间 ...

  9. Android ViewPager+Fragment 在Activity中获取Fragment的控件

    如果ViewPager+Fragment实现Tab切换,在activity中利用adapter.getItem获取到fragment然后再根据fragment.的方法获取控件 //隐藏求租,以下代码用 ...

  10. 一起学Android之ListView

    本文以一个小例子,简述Android开发中ListView的相关应用,仅供学习分享使用. 概述 ListView是一个显示可滚动项目列表的视图组(view group),列表项通过适配器(Adapte ...