ionic 获取input的值

1、参数传递法

例子:获取input框内容

这里有个独特的地方,直接在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文件中

 

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

2、双向绑定法

这种方法比较通用,但是需要在ts中定义对应的变量

例子1:获取input框内容

在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);
  }

例子2:获取单选按钮的值

在html页面中
 

 <ion-toggle [(ngModel)]="rememberName"></ion-toggle>

在ts文件中
  

rememberName: any;
  login() {
    console.log(this.rememberName);
  }

原文地址:https://www.cnblogs.com/yc-c/p/9580000.html

时间: 2024-08-02 13:21:55

ionic 获取input的值的相关文章

JS循环获取input的值

遍历class为input-text的文本框,获取值 $(".input-text").each(function(){ vals+=$(this).val()+','; }); 当然获取具有相同class的也可试用.jquery的各种选择器都是可用的.

微信小程序之动态添加、删除指定内容(view)和获取input值

这次遇到个问题: 1. 动态的添加指定的view内容..嗯..很简单..wx:for就搞定 2. 动态添加的内容中有input,最终获取值的时候,要获取到所有input的值并且是一个数组..嗯.. 3. 动态删除指定的已经添加的view内容.. 思路: 1. wx:for 循环view,添加一个,wx:for的内容就增加1个,那么循环的内容是用数字来循环还是数组呢? 2. input是循环出来的,所以不可能给不同的input绑定不同的 bindInput 事件,那么只有绑定一个输入事件,而且所有

JQuery获取input type=&quot;text&quot;中的值的各种方式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JQuery获取文本框的值</title> <meta http-equ

JS动态生成Input文本框 并获取文本框值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns= "http://www.w3.org/1999/xhtml" > <head> <meta http-equiv= "Conte

jquery获取input值的各种情况

jQuery获取多种input值的方法 获取input的checked值是否为true: 第一种: if($("input[name=item][value='val']").attr('checked')==true)  //判断是否已经打勾    --注:name即控件name属性,value即控件value属性 第二种: 可以不指定属性值,因一组checkbox的value值都会保存其在数据库中对应的id,最好写成如下方式: if($("input[name=row_c

如何用jquery获取&lt;input id=&quot;test&quot; name=&quot;test&quot; type=&quot;text&quot;/&gt;中输入的值?

如何用jquery获取<input id="test" name="test" type="text"/>中输入的值?$(" #test ").val()$(" input[ name='test' ] ").val()$(" input[ type='text' ] ").val()$(" input[ type='text' ]").attr(&quo

原生js循环获取表格中input的值

<table> <tbody class="tbody" id="pileListItemDesc"> <tr class="text-center lastTr"> <td class="index">4</td> <td class="depth"><input type="text" name="

js获取单选按钮的值

<!DOCTYPE html> <html> <body> <script type="text/javascript"> function select_patten(value) { // varvalue=document.getElementsByName(text).value; //  alert('hello'); alert(value); } </script> //以下这种方式只能获得单个单选按钮的valu

使用jquery获取radio的值

使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1.<input type="radio" name="testradio" value="jquery获取radio的值" />jquery获取radio的值<br /> 2.<input type="radio