I took some code I had from a previous college assignment learning about radio buttons and I’m trying to use them again for my Easter project, a currency exchange app(hence the odd names). But when i run it I get an error that says “Uncaught (in promise): invalid link: goToCurrencyConverter()” which i have in my home page.
Here is my code:
home.html
<ion-header>
<ion-navbar>
<ion-title text-center>
Currency Converter
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<img height="400" width="450" src="https://s3.amazonaws.com/babypips-media-production/images/2017/03/09071328/global-currency-symbols.jpeg">
<p text-center>THIS IS WHERE CURRENCY RATES GO</p>
<div class="center">
<button ion-button round color=primary (click)="goToCurrencyConverter()">Converter</button>
</div>
</ion-content>
home.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor(public navCtrl: NavController) {
}
goToCurrencyConverter(){
this.navCtrl.push("ConverterPage");
}
}
converter.html
<ion-header>
<ion-navbar>
<ion-title text-center>Converter</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-list radio-group [(ngModel)]="emotion">
<ion-item>
<ion-label>Happy</ion-label>
<ion-radio value="happy"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Sad</ion-label>
<ion-radio value="Sad"></ion-radio>
</ion-item>
<ion-item>
<ion-label>Lazy</ion-label>
<ion-radio value="Lazy"></ion-radio
></ion-item>
<ion-item>
<ion-label>Energetic</ion-label>
<ion-radio value="Energetic"></ion-radio>
</ion-item>
</ion-list>
<button ion-button large (click)="onSave()">Save</button>
<h2>Your status is: {{information}}</h2>
</ion-content>
converter.ts
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Storage } from '@ionic/storage';
@IonicPage()
@Component({
selector: 'page-converter',
templateUrl: 'converter.html',
})
export class ConverterPage {
emotion:string;
information:string;
constructor(public navCtrl: NavController, public navParams: NavParams,private storage: Storage) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad ConverterPage');
}
onSave(){
console.log(this.emotion);
this.storage.set("status",this.emotion);
}
ionViewWillEnter(){
this.storage.get("status").then((data) => {
this.information=data;
})
.catch((err) => {
console.log("Error = " + err);
})
}
}
Any help is appreciated