1.参数传递法

直接在input处使用 #定义参数的name值,注意在ts中参数的类型

html页面:

<ion-input type="text" placeholder="请输入账号" #username></ion-input>
<ion-input type="password" placeholder="请输入密码" #password></ion-input>
<button (click)="login(username, password)">登录</button>

ts文件中(HTMLInputElement类型)

login(username: HTMLInputElement, password: HTMLInputElement) {
    console.log(username.value)
    console.log(password.value)
  }

2.双向数据绑定

html页面:

<ion-input type="text" placeholder="请输入账号" [(ngModel)]="username"></ion-input>
<ion-input type="password" placeholder="请输入密码" [(ngModel)]="password"></ion-input>
<button (click)="login()">登录</button>

ts文件中:

username: string;
password: string;
login() {
 console.log(this.username);
 console.log(this.password);
}

ionic获取表单input的值的两种方法的更多相关文章

  1. PHP获取MySql新增记录ID值的3种方法

    From: http://www.jb51.net/article/51473.htm 这篇文章主要介绍了PHP获取MySql新增记录ID值的3种方法,一般使用PHP自带函数mysql_insert_ ...

  2. 选中没有选中的复选框,匹配含有某个字符串的正则,json取值的两种方法,把变量定义在外面跟里面的区别

    一.筛选没有选中的复选框:not("input:checked") 二.匹配有VARCHAR的字符串:".*VARCHAR.*?" 三.json取值的两种方法 ...

  3. javascript获取json对象的key名称的两种方法

    javascript获取json对象的key名称的两种方法 数据处理中,你可能接收到一个不确定内容格式的json对象,然后要把key的值提取出来.今天试过两种可以提取json key的方法,均可以正常 ...

  4. JMeter接口测试-提取动态列表最后一个值的两种方法

    前言 在用JMeter做接口测试时,我们经常会遇到,一个接口返回一个json串,在这个json串中,某个节点的值是一个列表,而且这个列表的长度是动态变化的.今天我们来学习两种提取动态列表最后一个值的两 ...

  5. javascript获取表单的各项值

    何谓表单? 表单是html页面中负责数据采集功能的部件,它往往由三个部分组成: 表单标签:<form></form> 用于声明表单的范围,位于表单标签中的元素将被提交.属性有m ...

  6. Java代码中获取配置文件(config.properties)中内容的两种方法

    方法千千万,本人暂时只总结了两种方法. (1)config.properties中的内容如图 在applicationContext.xml中配置 <!-- 引入配置文件 --> < ...

  7. js jquery, jquery-ui 获取form各种表单input的值?

    如何获取? make up (for): 弥补, 补偿, her beaty cannot make up for her stu'pidity. five Basic laws of human s ...

  8. 表单input中录入资料的检查方法及示例

    本文内容 表单录入信息的检查原则 常见检查的三种方法 示例     输入框有字符长度的限制     输入框有输入字符个数范围的限制 知识补给--检查方式的介绍     输入框只可(或不可)输入数 ...

  9. Selenium获取input值的两种方法:WebElement.getAttribute("value")和WebElement.getText()

    在页面元素的定位中,有时候需要获取到元素的页面显示值,用来作为断言.例如,我需要获取email的值"amy1111@xxx.com". <input class=" ...

随机推荐

  1. [Swift]LeetCode33. 搜索旋转排序数组 | Search in Rotated Sorted Array

    Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. (i.e. ...

  2. [Swift]LeetCode68. 文本左右对齐 | Text Justification

    Given an array of words and a width maxWidth, format the text such that each line has exactly maxWid ...

  3. [Swift]LeetCode687. 最长同值路径 | Longest Univalue Path

    Given a binary tree, find the length of the longest path where each node in the path has the same va ...

  4. [Swift]LeetCode837. 新21点 | New 21 Game

    Alice plays the following game, loosely based on the card game "21". Alice starts with 0 p ...

  5. pytthon—day8 读写模式的结合、文件操作模式、with完成文本文件复制、游标操作

    一.读写模式的结合 w:写指没有新建文件,有文件就清空 w=open('1.txt','w',encoding='utf-8') w.write('000\n') 在写入数据时,需要及时处理内存空间, ...

  6. 个人玩耍VUE..我的点点滴滴,今天很冷,2度!!!

    谢谢博客园,可以记录我的点点滴滴.!!这个小案例的效果图 其中,这篇还是上一篇博客的序章,我们直接看下更新的代码. Cart.Vue <template> <div class=&q ...

  7. 当子查询内存在ORDER BY 字句时查询会报错

    问题:当子查询内存在ORDER BY 字句时查询会报错 SQL: SELECT * FROM ( SELECT * FROM USER ORDER BY USER_CORD ) S. 解决办法:在子查 ...

  8. Solr 10 - SolrCloud集群模式简介 + 组成结构的说明

    目录 1 什么是SolrCloud 2 SolrCloud的结构 2.1 物理结构 2.2 逻辑结构 2.2.1 Collection(集合) 2.2.2 Core(内核) 2.2.3 Shard(分 ...

  9. PyQt:无边框自定义标题栏及最大化最小化窗体大小调整

    环境 Python3.5.2 PyQt5 陈述 隐藏掉系统的控制栏,实现了自定义的标题控制栏,以及关闭/最大化/最小化的功能,自由调整窗体大小的功能(跟随一个大佬学的),代码内有详细注释 只要把Mai ...

  10. EF架构~mysql中时间戳字段被认为是主键自增

    回到目录 如果在mysql中添加了自增字段,用来维护行的版本,那么在EF中会有一个问题,会把它当成是数据表主键,当你的真正主键是自曾时,就会把默认值0拼到生成的SQL语句里,导致你的insert出错, ...