Upper and Lower case function

Question

Good morning, I’m trying to do two methods, one for uppercase and the other Ower, but I’m not getting with typescritp and Ionic, follow the code:

I would like that when clicking upper, the text was sent in upper case to the other page and vice versa.

Typescript

import { TestePage } from './../teste/teste';
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Validators, FormBuilder, FormGroup } from '@angular/forms';
import { Clipboard } from '@ionic-native/clipboard';
import { Element } from '@angular/compiler';

/**
 * Generated class for the ResultPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({

  selector: 'page-result',
  templateUrl: 'result.html',
})
export class ResultPage {
  private todo : FormGroup;

  constructor(
    public navCtrl: NavController, 
    public navParams: NavParams,
    private formBuilder: FormBuilder
    ) {
      this.todo = this.formBuilder.group({
        title: ['', Validators.required]
      });


  }


  form: any ={
    texto: "" //this.todo.value.title
    }
 upper(){
   this.navCtrl.push(TestePage, {
     texto: this.todo.value.title

   })
}

lower(){
  this.navCtrl.push(TestePage, {
    texto: this.todo.value.title 
  })
}

  ionViewDidLoad() {
    console.log('ionViewDidLoad ResultPage');
  }

}

html:

<ion-header>

  <ion-navbar>
    <ion-title>result</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <!--

-->
      <form id="form" [formGroup]="todo" (ngSubmit)="logForm()">
          <ion-item>
            <ion-label></ion-label>
            <ion-input  type="text" formControlName="title"></ion-input>
          </ion-item>



        </form>
        <button (click)="upper()" id="btn" ion-button type="submit" >01</button>
        <button (click)="lower()" id="btn" ion-button type="submit" >02</button>

    </ion-content>

Answer 1

You want to send the texts in upper case and minuscule but are not transforming these texts, for this, use the native functions of Javascript to manipulate texts, thus:

upper(){
   this.navCtrl.push(TestePage, {
     // toUpperCase faz com que todo o texto fique em maiúsculo
     texto: this.todo.value.title.toUpperCase()
   })
}

lower(){
  this.navCtrl.push(TestePage, {
    // toLowerCase faz com que todo o texto fique em minusculo
    texto: this.todo.value.title.toLowerCase()
  })
}