作者：Grey

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

   
 

 
 

我们先来看一个简单的输入用户名和密码点击登录的界面：

 
 

  • 进入项目目录：cd MyFirstApp
  • 修改主页代码:

    app/pages/home/home.html

    预览一下效果：ionic serve -l

我们有两种方式来获取输入的数据:

 
 

  • 第一种：通过[(ngModel)]来获取参数值，修改home.html的代码为如下形式

    在home.ts增加一个获取用户名和密码并在浏览器的控制台打印出来：

    运行程序：ionic serve -l, 并在用户名和密码框中分别输入相关信息，点击登录按钮，打开浏览器控制台，即可看到获取的信息

  • 第二种方式，采用Form Builder，修改home.html

    在html.ts中，增加如下代码：

    运行：ionic serve -l

    打开Chrome的控制台，可以查看获取的数据：

 
 

 
 

------

上一篇：Ionic2学习笔记（6）：Navigation

下一篇：Ionic2学习笔记（8）：Local Storage& SQLite

Ionic2学习笔记（7）：Input的更多相关文章

  1. Ionic2学习笔记（8）：Local Storage& SQLite

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5557947.html              Ionic2可以有两种方式来存储数据,Local S ...

  2. Ionic2学习笔记（6）：Navigation

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5551535.html           Ionic2中创建一个页面很方便,在页面之间相互切换也很方 ...

  3. Ionic2学习笔记（10）：扫描二维码

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5575843.html 时间:6/11/2016     说明: 在本文发表的时候(2016-06-1 ...

  4. Ionic2学习笔记（9）：访问本地设备

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5559927.html               Ionic2提供了访问本地设备的方法,但是需要安装 ...

  5. Ionic2学习笔记（5）：Provider

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5547646.html             Provider是一种为App提供数据源的方式, 举个 ...

  6. Ionic2学习笔记（0）：HelloWorld

    作者:Grey 原文地址:http://www.cnblogs.com/greyzeng/p/5529153.html 操作系统: Windows 10 环境配置: Node.js Java SE D ...

  7. Ionic2学习笔记（4）：*号

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5544479.html                     大家常常会在ionic2页面中见到*号 ...

  8. Ionic2学习笔记（3）：Pipe

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5538630.html Pipe类似过滤器,比如,在一个字符串要展现在页面之前, 我们需要对这个字符串 ...

  9. Ionic2学习笔记（2）：自定义Component

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5536298.html                     上一篇提到,Ionic2提供了很多Co ...

随机推荐

  1. IOS网络第七天WebView-04仿网易新闻详情

    *************** #import "HMViewController.h" @interface HMViewController () @end @implemen ...

  2. Algorithm | Binary Search

    花了半天把二分查找的几种都写了一遍.验证了一下.二分查找的正确编写的关键就是,确保循环的初始.循环不变式能够保证一致. 可以先从循环里面确定循环不变式,然后再推导初始条件,最后根据循环不变式的内容推导 ...

  3. UI控件（UIScrollView）

    @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //创建一个scrollview UIScrollV ...

  4. 我的权限系统设计实现MVC4 + WebAPI + EasyUI + Knockout（一）

    一.前言 之前的博客一直都还没写到框架的实现及权限系统,今天开始写我的权限系统,我以前做过的项目基本上都有权限管理这个模块,但各个系统都会有一些不太一样,有些简单点,有些稍微复杂一点,一句话,我们做的 ...

  5. 【java并发编程实战】-----线程基本概念

    学习Java并发已经有一个多月了,感觉有些东西学习一会儿了就会忘记,做了一些笔记但是不系统,对于Java并发这么大的"系统",需要自己好好总结.整理才能征服它.希望同仁们一起来学习 ...

  6. SQL Server 查询分解

    标签:SQL SERVER/MSSQL SERVER/数据库/DBA/查询步骤 概述 查询步骤是很基础也挺重要的一部分,但是我还是在周围发现有些人虽然会语法,但是对于其中的步骤不是很清楚,这里就来分解 ...

  7. 使用Hexo搭建专属Blog

    喜欢折腾的自己最开始在博客园有仿写几篇Blog,虽也可以自己改变风格,可是到底不是独立的一块儿地方,要知道独立的才是自己的;有属于自己独立的域名和Blog,真真是一件很爽的存在.在各种大牛的分享下在G ...

  8. CSS系列：CSS3新增选择器

    1. CSS1定义的选择器 选择器 类型 说明 E 类型选择器 选择指定类型的元素 E#id ID选择器 选择匹配E的元素,且匹配元素的id为“id”,E选择符可以省略. E.class 类选择器 选 ...

  9. Entity Framework Code First执行SQL语句、视图及存储过程

    1.Entity Framework Code First查询视图 Entity Framework Code First目前还没有特别针对View操作的方法,但对于可更新的视图,可以采用与Table ...

  10. 【Win10 应用开发】扫描和连接Wi-fi网络

    老周今天带大家去“扫雷”了,别当真,是扫描并连接指定无线网络,时尚一点叫Wi-fi. 所以,今天的任务要求你的设备至少有1张无线网卡,目前老周没看到过有N张无线网卡的设备.像笔记本.平板等设备都可以, ...