这是我的项目的用户界面
大家好,我想问问我是否有可能根据地点和年份来传递价值?这是我在ionic上的第一个项目,它是一个简单的计算器,但是要计算的数量取决于位置和年份。
例如,我将利率设为10,然后在上一个索引中,我选择了UK位置,利率将除以2,然后输入2011年,它将再次除以2。
之后,对于新索引,我将重复输入,但现在它将根据所选的位置和年份相乘。
这是我的.html,用于显示我的费率,位置和年份。我还包括一个按钮,该按钮将在离子输入占位符处显示总量。
我不知道在.ts中编码什么
<ion-list>
<ion-item>
<ion-label stacked>Rate</ion-label>
<ion-input type="text" text-right id="input" ></ion-input>
</ion-item>
<br>
<br>
<ion-list-header>Previous Index</ion-list-header>
<ion-list>
<ion-item>
<ion-label>Location</ion-label>
<ion-select value="50" okText="Okay" cancelText="Dismiss">
<ion-select-option value="50">UK</ion-select-option>
<ion-select-option value="70">US</ion-select-option>
<ion-select-option value="30">Canada</ion-select-option>
</ion-select>
</ion-item>
</ion-list>
<ion-item>
<ion-label>Year</ion-label>
<ion-datetime [pickerOptions]="customPickerOptions" placeholder="Select One"
displayFormat="YYYY" min="2011" max="2019"></ion-datetime>
</ion-item>
<ion-button type ="submit">Total</ion-button>
<div class="window"></div>
<div class="input"><span>
<ion-input type="text" placeholder="0" name="display">
</ion-input>
答案 0 :(得分:0)
您的html应该看起来像这样,
<ion-item>
<ion-label>Location</ion-label>
<ion-select (change)="onSelectionChanges($event)" [(ngModel)]="currentSelection" okText="Okay" cancelText="Dismiss">
<ion-select-option selected="true" value="50">UK</ion-select-option>
<ion-select-option value="70">US</ion-select-option>
<ion-select-option value="30">Canada</ion-select-option>
</ion-select>
</ion-item>
您可以将一些onChange事件绑定到离子选择。并触发一些方法,例如:onSelectionChanges()
export class Example{
currentSelection = '50';
onSelectionChanges(event: any) {
// Your logic to apply when selection happens, goes here
//You can also get the value in the variable currentSelection
console.log(this.currentSelection);
//another way is to access the changed value from event
console.log(event.target.value);
}
}