Ionic2学习笔记(3):*号

作者:Grey

原文地址: http://www.cnblogs.com/greyzeng/p/5544479.html

? ? ?
?

?
?

大家常常会在ionic2页面中见到*号的存在,如:

<p *ngIf="someBoolean"><p>

含义与:

<template [ngIf]="someBoolean">

<p></p>

</template>

一样,

即:如果someBoolean值为true,则显示<p></p>标签,否则,不显示<p></p>标签

?

<p *ngFor="let item of items">{{item.name}}</p>

含义:

获取一个列表items,并遍历其中的元素item,然后显示这个元素的name属性的值

?

<div [ngSwitch]="paragraphNumber">

<p *ngSwitchWhen="1">Paragraph 1</p>

<p *ngSwitchWhen="2">Paragraph 2</p>

<p *ngSwitchWhen="3">Paragraph 3</p>

<p *ngSwitchDefault>Paragraph</p> </div>

paragraphNumber=1时,显示: Paragraph 1

paragraphNumber=2时,显示: Paragraph 2

依次类推

默认显示:Paragraph

?

?

------

上一篇:Ionic2学习笔记(3):Pipe

时间: 2024-10-19 20:48:18

Ionic2学习笔记(3):*号的相关文章

Ionic2学习笔记(5):Provider

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5547646.html ? ? Provider是一种为App提供数据源的方式, 举个例子: 我们从: https://www.reddit.com/r/gifs/top/.json?limit=10&sort=hot 获取Json格式的数据,并在程序启动的时候,在控制台打印获取的数据信息: 进入项目目录:cd MyFirstApp 创建一个Provider:ionic g provider New

Ionic2学习笔记(10):扫描二维码

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5575843.html 时间:6/11/2016 ? ? 说明: 在本文发表的时候(2016-06-11),Ionic2是beta版本,所有还是会有一些改动比较大的地方: 点击查看 , 比如beta8版本(2016-06-06),相较于前面的版本就有一个特别大的改动的地方: @App and @Page should be replaced with @Component 基于这种情况,大家还是静静

Ionic2学习笔记(8):Local Storage& SQLite

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5557947.html ? ? ? ? ?Ionic2可以有两种方式来存储数据,Local Storage和SQLite ? LocalStorage ? 因为比较容易访问,所以不适合存比较敏感性的数据 比如可以存储: 用户是否登录的信息. 一些session信息等 具体用法: 进入项目目录:cd MyFirstApp 在主页设置一个按钮,点击按钮,获取LocalStorage的数据并打印在控制台

Ionic2学习笔记(7):Input

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5554610.html ? ? ? 我们先来看一个简单的输入用户名和密码点击登录的界面: ? 进入项目目录:cd MyFirstApp 修改主页代码: app/pages/home/home.html 预览一下效果:ionic serve -l 我们有两种方式来获取输入的数据: ? 第一种:通过[(ngModel)]来获取参数值,修改home.html的代码为如下形式 在home.ts增加一个获取用

Ionic2学习笔记(6):NAVIGATION

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5551535.html ? ? ? ?Ionic2中创建一个页面很方便,在页面之间相互切换也很方便,我们在实现如下需求: 在主页面创建一个按钮,点击按钮,跳转到一个新页面,在跳转过程中,我们可以也可以在页面之间传递数据. 进入项目目录:cd MyFirstApp 创建一个新页面: ionic g page SecondPage 将@import "../pages/second-page/secon

Ionic2学习笔记(3):Pipe

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5538630.html ? ? ? ? ? ? Pipe类似过滤器,比如,在一个字符串要展现在页面之前, 我们需要对这个字符串进行一些操作,比如:将字符串转化为大写,加一个前缀/后缀-- Pipe的作用就是来实现类似的需求: 模型如下: ? ? ? 假设一个字符串: "hello", 我们在展示这个字符串的时候,需要先转换为大写, 然后加一个后缀 " WORLD", 最

Ionic2学习笔记(9):访问本地设备

作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5559927.html ? ? ? ? Ionic2提供了访问本地设备的方法,但是需要安装Cordova依赖,我们以调用摄像头拍照为例来说明: 进入项目目录:cd MyFirstApp npm install ionic-native –save 增加调用Camera的插件:ionic plugin add cordova-plugin-carmera 在Home.html中,增加如下代码: 点击b

Ionic2学习笔记

Component nav: <ion-nav [root] = 'rootComponent'></ion-nav> ....import {Nav} from 'ionic-angular';.... export class AppComponent{ @ViewChild(Nav) private nav:Nav; push(){ nav.push(PageOne,{id:1,name:'ztw'}); } } @Component({template:`<p>

QTP,自动化测试学习笔记,六月九号

测试自动化实现的两个难点 设计--功能分解 实现--对象的识别 测试自动化实现的两个难点-功能分解 清晰画出业务流程图 根据业务流程分解业务功能,可以被复用的功能也要被分解出来. 按照路径覆盖的思想,组织测试用例 测试自动化实现的两个难点-对象识别 创建测试    获取被操作对象的属性信息 使用唯一的对象名在对象仓库中记录该对象. 标识关键属性信息 在脚本中记录对象名称和相应的动作. 运行测试 从脚本中获得对象名称. 在对象仓库中定位对象,并获取其关键属性. 根据关键属性信息在被测应用中定位对象