如何从ion 3中的ion-input字段中获取城市名称？
从ion 3中的ion-input字段中获取城市名称的方法如下：
- 首先，确保你已经在Ionic项目中正确地使用了ion-input组件，并且已经在ion-input字段中输入了城市名称。
- 在你的Ionic组件的代码中，使用ViewChild装饰器来获取ion-input字段的引用。例如，假设你的ion-input字段有一个名为cityInput的引用，你可以这样获取它：
- 在你的Ionic组件的代码中，使用ViewChild装饰器来获取ion-input字段的引用。例如，假设你的ion-input字段有一个名为cityInput的引用，你可以这样获取它：
- 现在，你可以在你的组件中的任何方法中使用cityInput引用来获取输入的城市名称。例如，你可以在一个按钮的点击事件处理程序中获取城市名称：
- 现在，你可以在你的组件中的任何方法中使用cityInput引用来获取输入的城市名称。例如，你可以在一个按钮的点击事件处理程序中获取城市名称：
- 在上面的代码中，我们使用cityInput.value来获取ion-input字段中输入的值，并将其存储在cityName变量中。你可以根据需要进一步处理这个城市名称，比如发送到服务器或进行其他操作。
这是一个基本的示例，展示了如何从ion-input字段中获取城市名称。根据你的具体需求，你可能需要在获取城市名称之前进行一些验证或处理。此外，你还可以使用其他Ionic和Angular提供的功能来增强你的应用程序。
相关·内容
我在ionic中使用以下代码询问用户的邮政编码和城市：
<ion-row>
<ion-col col-5>
<ion-item no-padding>
<ion-input type="number" class="input-without-icon"
[placeholder]="'reportDetails.contactData.label.postalCode' | translat
浏览 1提问于2018-02-16得票数 0
如何从我的输入字段中设置href标签的值。当用户单击href标记的值时，应该调用="skype:+ (value from input)？“
<ion-content padding>
<ion-col>
<ion-label color="primary">Enter The No.</ion-label>
<ion-input placeholder="Text Input"></ion-input>
<a href="
浏览 17提问于2018-02-15得票数 0
回答已采纳
下面是电子邮件和密码的两个离子标签：
<ion-item>
<ion-label color="primary" floating>Email id</ion-label>
<ion-input id = "email" type="email" ></ion-input>
</ion-item>
<ion-item>
<ion-label color="primary" floating>Password&l
浏览 3提问于2017-01-02得票数 0
下面的代码用作基于Google Places API的自动补全程序；一旦我开始在输入字段中键入一些字符，它就会开始获取并显示一些地名；我想要做的是，当我单击生成的place时，它会替换我从knowing that I have 2 input field below中编写的字段的当前值，因此我需要在click上使用该值，并替换写在特定字段上的当前值。
<ion-item><ion-input #pickUp (keyup)="updateSearch(pickUp.value)" type="text" placeholder="P
浏览 2提问于2017-05-11得票数 0
我是ionic的新手，在学习ionic online后创建了一个基本的移动应用程序。 我已经创建了一个客户详细信息表单页面，客户需要输入他们的详细信息，如姓名，性别，道布，城市等。 而不是手动输入详细信息，我想把二维码扫描仪在页面上，以便当Aadhaar或任何其他条形码详细信息保存程序二维码被扫描时，客户详细信息需要自动填写。 下面是代码 <ion-content>
<ion-item>
<ion-label position="floating" >Full Name</ion-label>
&
浏览 26提问于2019-05-17得票数 0
2回答
我在Angular中创建了一个表单，它根据用户输入设置各种字段。问题是表单似乎不能接受用户对单播组的输入，我不知道如何编码。
我试着根据表单的其他部分(所有这些部分都可以工作)为单播组建模。
在我的表格中，我有：
export class FormPage implements OnInit {
myForm: FormGroup;
showID: boolean;
showName: boolean;
showBirthday: boolean;
showSex: boolean;
constructor(
private formService: Fo
浏览 0提问于2019-07-16得票数 0
1回答
我正在用ionic 3开发一个SIgnup页面，字段的编号是10。所以我使用一个p标签来显示验证，当用户点击submit时，我想把他一直带到页面的开头，那里有我的标题和all.How我可以做到吗?我已经尝试了所有的方法。下面是我的代码：
<ion-content padding class="label-cl green-bg acct-sct item-row" style="position:fixed">
<h2 class="center-col">Create An Account</h2>
浏览 9提问于2018-01-15得票数 0
回答已采纳
我使用离子3作为我的移动应用程序，我有一些问题，我的输入字段，不自动移动到下一个字段。例如，当我单击第一个输入字段并填充第一个输入字段时，光标不会移动到下一个字段。如何正确地做到这一点？
<ion-grid>
<ion-row>
<ion-col>
<ion-item >
<ion-input type="tel" placeholder="*" maxlength="1" tabindex="1"
浏览 0提问于2018-02-05得票数 11
回答已采纳
1回答
我需要在我的Ionic 4应用程序中动态添加一个字段。我在ts文件中声明了一个数组变量。 fields: []; 当我按下按钮时，我想生成一个包含输入字段的新字段。这是我在视图上的代码： <ion-grid>
<ion-row *ngFor="let field of fields">
<ion-col>
<ion-input></ion-input>
</ion-col>
<ion-col>
<ion-in
浏览 19提问于2019-03-12得票数 0
回答已采纳
我在角9上有模板驱动的登录表单。
<form name="login" #loginForm="ngForm" (ngSubmit)="loginForm.form.valid && login()" *ngIf="loginPage" novalidate>
<ion-item>
<ion-label position="stacked">{{accountPage.your_email}} </ion-label>
浏览 1提问于2020-11-18得票数 0
回答已采纳
我从ion-select中获取数值，并在ion-input中输入一个数字。如何将原始页面中的选定值和输入值显示到另一个页面？我使用的是ionic 4 <ion-item>
<ion-input #user2 type="tel" maxlength="14" minlength="4" [(ngModel)]="numpad"
name="userCount" (keypress)="numberOnlyValidati
浏览 20提问于2020-01-04得票数 0
回答已采纳
发布：当我在显示和隐藏密码之间切换时，输入的formControlName‘密码’值没有反映。
flow：
在密码字段中输入一些值。
使用显示密码切换字段
密码字段为空
我的观点部分：
<ion-input formControlName="password" placeholder="Password*" type="password" (ngModelChange)="onChange($event)"
autocomplete="off" [h
浏览 7提问于2016-11-22得票数 1
回答已采纳
我正在使用Ionic 2，在我的应用程序上，我正在创建一个表单，如果存在验证错误，信息图标将出现在其相关输入字段的右侧。HTML如下所示，
<ion-list inset padding>
<ion-item>
<ion-input type="text" placeholder="Email"></ion-input>
<ion-icon name="ios-information-circle-outline" item-ri
浏览 5提问于2016-04-12得票数 5
回答已采纳
就像标题所说的，你知道为什么我的字段值在我的Ionic 4表单中自动设置在Object HTMLInputElement上吗？ 我使用表单驱动验证的其他表单没有问题，但这个表单在组件加载时直接在我的字段中输入对象HTMLInputElement。 我尝试将值设置为"“，但没有成功。 <ion-header>
<ion-title>Connexion</ion-title>
</ion-header>
<ion-card>
<form #connexionForm (ngSubmit)="connexion
浏览 26提问于2019-02-11得票数 1
回答已采纳
4回答
我试图在<ion-input>中添加一个按钮，但是在<ion-list>中添加按钮时，该按钮不会显示在屏幕上。
我要做的是在右边对齐的密码字段顶部显示一个“忘记”按钮。参考屏幕：
这是我的HTML
<ion-content>
<ion-list class="au-form" inset padding>
<ion-item>
<ion-input type="text" placeholder="Username">&l
浏览 3提问于2016-03-24得票数 10
回答已采纳
2回答
我希望动态添加输入域，这是可能的吗？有人举了个例子怎么做？例如，当我从select options 2输入字段中选择时，它会显示我，而当我选择5个输入字段时，它会显示5个输入字段
我想要做这样的事情
<ion-item>
<ion-label fixed>Field 1</ion-label>
<ion-input type="text" value=""></ion-input>
</ion-item>
<ion-item *ngIf="someV
浏览 4提问于2016-11-17得票数 2
1回答
我正在创建一个ionic 4应用程序，它有一个表单，该表单由ionic语音识别插件填充。我只能填写表单的一个字段，但是如何从语音识别中获取多个输入，并将这些值设置到表单的多个输入字段中。 下面是我的HTML代码： <form [formGroup]="myForm">
<ion-item>
<ion-label position="stacked">FirstName</ion-label>
<ion-input formControlName=
浏览 16提问于2019-09-20得票数 1
1回答
我要求用户在分隔字段中输入SMS接收的代码。
这条路：
<ion-input type="text" inputmode="numeric" maxlength="1" [(ngModel)]="field1" name="field1" (ionChange)="eventIonChange($event, 2)" (ionFocus)="eventIonFocus($event)" autofocus="true"></ion-input>
浏览 11提问于2019-10-17得票数 2
回答已采纳
4回答
在Ionic 4中，如何进行双向绑定。在Ionic 3中，我会做以下几件事：
<ion-item color="light"> <ion-input type="string" placeholder="Username" [(ngModel)]="username"></ion-input> </ion-item>
然而，在Ionic 4中，我得到了以下错误：
Can't bind to 'ngModel' since it isn't a know
浏览 1提问于2018-09-12得票数 6
回答已采纳
我很确定这很容易做到，但我在任何地方都找不到解决方案。 我有一个名为agenda的formGroup。在启用提交之前，所有字段都是必填的且有效。我还希望最后一个字段只有在等于用户输入的某个数字(由solution定义)时才有效。我简化了下面的代码： <form (ngSubmit)="submitForm()" [formGroup]="agenda" class="bodytext">
<ion-input type="text" name="email" formControlName=
浏览 24提问于2020-12-16得票数 0
回答已采纳
在这里我只想有一个城市的名字，我可以简单的得到，我关注了一些博客，但有点困惑。 我的html <ion-input type="text" [(ngModel)]="default.city"></ion-input> 我希望是这样的 this.cityName = somefunction(inputText) {
...
return city;
} 我正在寻找一些离子cordova插件，以自动完成键入的位置，并列出可能的位置，并选择其中之一。
浏览 20提问于2019-05-03得票数 0
我需要格式化ion-input的输出，所以我不希望输入字段返回用户实际输入的内容。我有一个从ngModelChange调用的函数，只想显示该函数的结果，即离子标签内的变量formatNum，并隐藏用户在离子输入中实际输入的内容。
<ion-item no-padding class="rightBorder">
<ion-label fixed>Phone 1</ion-label>
<ion-input placeholder="(###) ###-####" [(ngM
浏览 0提问于2018-07-06得票数 1
1回答
我有用户名和密码字段。我想为用户提供显示/隐藏密码文本选项。我在中创建了代码
<ion-content class="has-header" padding>
<form>
<ion-item>
<ion-label floating>Username</ion-label>
<ion-input type="text"> </ion-input>
</ion-item>
<ion-item *ng
浏览 1提问于2016-07-18得票数 2
我知道(ngModel)是双向绑定的.
我有一个输入字段。它应该显示来自db的值，并允许用户更改它并保存回db中。
为此，我认为我应该使用(ngModel)，以便可以从ts文件中的变量(从db检索)中设置字段值。是否可以通过任何其他方式实现同样的目标，只需像下面这样使用ngModel？
<ion-item>
<ion-label floating>First Name</ion-label>
<ion-input type="text" ngModel name="firstName" r
浏览 0提问于2018-12-08得票数 1
回答已采纳
1回答
我遇到了键盘问题。我有一个包含5个输入字段的列表的页面。当键盘显示时，页面向上推，而当键盘隐藏时，页面位置保持不变。当我检查它时，显示即使在键盘隐藏之后也存在padding-bottom:300px。对于同样的问题有什么解决方案吗？请找到下面的html代码
<ion-content padding #content>
<img src="assets/imgs/ic_tutorial_three.png" style="height:150px;width:150px">
<ion-card>
<ion-item&g
浏览 0提问于2018-06-11得票数 0
1回答
我正在使用Ionic2，我想使用POST请求将数据从表单发送到web服务，但每次打印表单数据时，我发现它是空的，并且服务通知我它没有收到数据。这是我的html代码：
<div class="login-box">
<form #registerForm="ngForm">
<ion-row>
<ion-col id="imageContainer">
<button (click)="upload(
浏览 2提问于2017-07-25得票数 1
我正在使用BackendLess构建一个基于Ionic的项目。但是，我似乎不能在类型记录文件中使用HTML元素的id。
我在代码中使用了@ViewChild。
HTML代码：
<ion-item>
<ion-label floating>Name</ion-label>
<ion-input type="text" id="name"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Emai
浏览 2提问于2017-08-07得票数 0
1回答
我在我的项目中绑定使用google api autoComplete，但是它给了我一个错误：
TypeError: Cannot read property 'getInputElement' of undefined
.html
<section
[formGroupName]="i"
*ngFor="let tech of form.controls.stations.controls; let i = index">
<ion-item-group>
浏览 0提问于2019-12-08得票数 0
回答已采纳
我有一个ion-input字段，它必须使用来自后端服务的对象或空值，并返回对象或空值。我可以这样做，但输入字段将按预期显示对象对象。 对象 {ContactRelationID: 345678, Name: Thomas} ion-input显示对象对象 <ion-input name=“test” [(ngModel)]="ContractorInput" readonly></ion-input> ion-input显示Thomas使用object，但失败并返回null <ion-input name=“test” [(ngModel
浏览 20提问于2020-09-26得票数 0
回答已采纳
<ion-card *ngFor='#product of products | mapToIterable:"key":true'>
<ion-list>
<ion-item>
<ion-label stacked>Account No. / Phone No.</ion-label>
<ion-input type="text" [(ngModel)]="product.msisdn">
浏览 0提问于2016-04-18得票数 4
回答已采纳
3回答
我需要在行中显示两个输入字段，如下所示：
但当我用：
<ion-list>
<ion-item>
<ion-label stacked> Phone Number</ion-label>
<ion-grid>
<ion-row>
<ion-col>
<ion-input type="tel" placeholder="Area code"></ion-input>
</ion-col&
浏览 1提问于2017-10-09得票数 3
2回答
是否可以从具有类型属性的json文件创建动态表单，并根据收到的属性显示表单？
我找到了一个运行良好的代码，但是如果有一天我收到一个新元素，我必须返回代码以添加一个条件，那么它就不太有效了。
var finalj = JSON.parse(json);
console.log(finalj.schema.customer);
/* var property;
for ( property in finalj.schema["customer"] )
浏览 1提问于2018-04-24得票数 1
回答已采纳
2回答
我试图从火基中检索单个对象，并将其输出到表单中进行编辑。我使用以下方法检索单个对象：
this.product = this.af.database.object('/products/'+ productId);
并尝试将其输出到模板中，如下所示：
<ion-item>
<ion-label stacked>Date</ion-label>
<ion-datetime [(ngModel)]="product.date" name="date" required></
浏览 3提问于2017-04-26得票数 1
回答已采纳
我想在firebase中添加一个username字段，因为所有人都说我们不能在firebase中添加直接的username字段。我正在尝试通过更新方法添加。这里我得到了一个代码，如果我以这种方式在代码中增加价值，但我不知道如何通过输入来增加价值。
file.ts
this.fAuth.auth.onAuthStateChanged(function (user) {
if (user) {
// Updates the user attributes:
user.updateProfile({ // <-- Update Method here
displ
浏览 3提问于2018-11-17得票数 0
1回答
我通过运行一个循环创建了一个表单，如果条件，根据我在JSON中接收的数据，所有字段都是通过这种方式动态创建的。
我尝试过使用[(ngModel)]，但是正如您所看到的，我正在动态地创建字段，也就是说，我不能创建唯一的[(ngModel)]。
{
"status": "success",
"message": "Form Successfully Fetched!",
"newData": [
{
"languagePreference"
浏览 0提问于2019-01-04得票数 0
回答已采纳
1回答
我有一个简单的表单，有两个字段:用户名和电子邮件。我的测试如下所示：
...
fit('should create', () => {
console.log(fixture.debugElement.nativeElement.childNodes);
expect(component).toBeTruthy();
});
....
我刚刚将console.log添加到生成的spec文件中。从下面的输出中可以看到，ion-input元素不包含input元素。你知道为什么吗？(我需要它来运行附加到输入的模糊处理程序)
LOG: NodeList{0:
浏览 12提问于2020-05-27得票数 4
对于有棱角2和打印文本的建筑来说，我尝试做一些我经常做的事情，否则，就是从输入表单收集信息，在这种情况下，这是电子邮件。
现在我不能使用var x = document.getElementById("email").value;，因为类型记录出现了一个错误，所以我去用它代替了var x = (<HTMLInputElement>document.getElementById("email")).value;，但是现在我得到了undefined，我的undefined是这样的：
<div class="padding" sty
浏览 1提问于2017-05-06得票数 1
回答已采纳
我正在尝试让一些可编辑的文本在离子输入中工作。因此，当用户轻敲离子输入时，用户将能够编辑文本。
如何让editUserName & editUserName的Ng模型等于UserName & UserBio的值
我尝试在ngOnInit上设置editUserName & editUserName的值
就像这样
ngOnInit() {
this.recordRow.EdituserName = this.userName;
或
this.item.EdituserBio = this.item.userBio;
或
this.item.Ed
浏览 51提问于2019-10-31得票数 0
回答已采纳
我正在尝试实现一个带有with选项的密码字段
<ion-item>
<ion-label color="dark" fixed>Mot De Passe</ion-label>
<ion-input type="password"></ion-input>
<ion-icon
[name]="isActive?'eye':'eye-off'"
item-right
(click)="isActi
浏览 0提问于2017-02-16得票数 3
回答已采纳
我有一个Edit Profile视图，我从远程服务器获取数据，然后我想用从服务器返回的数据填充表单。这是我所尝试过的，而且运作良好，但我不知道这是否正确的做法。
所以在ngOnInit(中)我正在创建formBuilder，实际上表单比这个大很多，所以为了保持问题的简单，我只添加了两个字段
ngOnInit() {
this.profile = this.formBuilder.group({
firstName: ['', [Validators.required]],
lastName: ['Last Name'],
浏览 2提问于2017-04-20得票数 1
回答已采纳
3回答
请看一下我的形象
。
在输入字段中输入数据并单击键盘enter/Go按钮后，它没有做任何事情--它表现得很理想。
是否有任何插件来控制键盘(enter，search，go..etc)按钮来执行类似的(单击)功能。如何激活每个输入字段中的enter/go按钮？
更新
这是我的html代码
<ion-item>
<ion-label primary floating>Email/Mobile</ion-label>
<ion-input type="text" [(ngModel)]="logi
浏览 5提问于2016-11-17得票数 2
回答已采纳
3回答
如何在提交时验证反应式表单？
、、、、
我正在为我的申请使用反应式表单，我想在提交时验证表单，但我无法做到这一点。这是我的代码，任何人都可以让我知道我做错了什么或遗漏了什么。
这是我的表单生成器
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController,LoadingController, Events,AlertController } from 'ionic-angular';
import {Validators, FormBuilder, Form
浏览 0提问于2018-09-18得票数 0
1回答
我正在工作的移动web开发项目，在登录页面，我需要防止或清除密码字段，其中得到自动填充。我尝试使用一个隐藏的type=“密码”的虚拟字段，另一个是实际的密码字段。我已经将虚拟字段置于实际密码字段的前面。我以为它会起作用，但它不起作用。下面是我的代码片段。下面是用于虚拟字段的
<ion-input style="display:none;">
<ion-label>Password</ion-label>
<input type="password" name="foilautofill" ma
浏览 3提问于2016-01-13得票数 0
回答已采纳
1回答
如何为文本字段设置ionic2最大长度。我能够设置'tel‘字段，但不能为文本字段设置。
<ion-input maxlength="12" type="tel">
但下面的那个不行，
<ion-input maxlength="12" type="text">
浏览 0提问于2016-12-19得票数 0
1回答
我有一个表单，并希望将表单输入作为离子数组传递到类型记录文件中。
question.page.html中的形式
<details *ngFor="let product of products;">
<ion-input type="text" [(ngModel)]="productId" value="{{product.id}}"></ion-input>
<h2>Question</h2>
<ion-input type="
浏览 2提问于2021-10-22得票数 0
2回答
我需要你的帮助。我想将用户在文本字段中写入的数据传递到另一个页面。我的目标是使用在第二个页面中作为变量传递的数据在console.log中打印。
问题是我可以在console.log中看到正确的值(我在文本字段中写的值)和在同一页的同一行中的“未定义”。
在我的第一个page.ts中，我有
export class LoginPage {
public nomeUtente: string;
constructor(
public navCtrl: NavController,
) {
}
nomeScelto() {
let nomeUtente = this.nomeU
浏览 12提问于2018-01-18得票数 2
将用户输入添加到设置宽度的输入窗体时，下划线会延伸到输入的边界之外。
给定以下代码：
<ion-list lines="none">
<ion-item>
<ion-label color="medium" position="floating">Username</ion-label>
<ion-input type="text" formControlName="username" autoc
浏览 7提问于2019-08-15得票数 5
回答已采纳
我需要在输入字段中定义一个值，不是一个element.value，而是一个data，但是我不知道如何在实践中这样做.有人能在这黑暗中给我一束光吗
在引用数据时，我指的是字符串或int值类型的信息。
我的Html元素的想法或者我想要的东西
<ion-input #alpha type="text" data-datavalue="some Value" (ionChange)="functioEvent(data)"></ion-input>
我的剧本
fuctionEvent(data){
console.lo
浏览 1提问于2020-04-08得票数 0
回答已采纳
2回答
我有一些输入fields.But的输入字段将显示一次。我会得到我需要的信息，如下所示。
require_nid:false
require_pin:true
发件人如下
<ion-col>
<ion-list inset>
<ion-item>
<ion-label>
<ion-icon name="person"></ion-icon>
</ion-label>
浏览 0提问于2018-05-20得票数 2
回答已采纳
1回答
我陷入了一个相当基本的问题，但不知道如何谷歌它。
在我的Ionic2应用程序中，我有一个AddPassengerPage，里面有姓名、电子邮件和电话的inout字段。在我的模块中，我声明了这些变量：
name: string;
phone: string;
email: string;
因此，在我看来，我可以将输入字段绑定到它：
<ion-input type="text" [(ngModel)]="email"></ion-input>
稍后，我希望将乘客传递给提供者，后者将其发送到我的API。我想要做的不是简单地有三个变量，而是在pa
浏览 0提问于2018-05-10得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
