Switch ion-textbox input with Typescript using JQuery

Ionic Framework ionic-v3
1

How do I swap input in TextBox 1 and TextBox 2

<ion-input type="text" id="from"></ion-input>
<ion-input type="text" id="to"></ion-input>
<input id="swap" type="button" value="Swap"/>

and here is the JQuery

    $(document).ready(function (){
     
    $("#swap").on('click',function(){
        var from = $('#from').val();
        $('#from').val($('#to').val());
        $('#to').val(from);
        
        
    });

How can I convert this to use in Typescript ?

2

Use Angular to bind to the properties of the input. Don’t use jQuery at all - performance issue.

3

Kindly help me bind the two textboxes with a button

4

How much of the Angular docs have you read please?

5

Alot! I have been using Angular for years now

6

acinoasnc

7 
<ion-input type="text" [(ngModel)]="from"></ion-input>
<ion-input type="text" [(ngModel)]="to"></ion-input>
<input id="swap" type="button" (click)="swapValues()/>

public swapValues() {
  let from = this.from;
  this.from = this.to;
  this.to = from;
}
1 Like