@tobias1000 wrote:
Hello,
If I change the value of the global variable “image” during runtime (Via clicking the button), I get the following error:
Runtime Error
image is not defined
Stack
ReferenceError: image is not defined
at HomePage.webpackJsonp.194.HomePage.openFirstPage (http://localhost:8100/build/main.js:69:15)
at Object.eval [as handleEvent] (ng:///AppModule/HomePage.ngfactory.js:32:31)
at handleEvent (http://localhost:8100/build/vendor.js:13608:172)
at callWithDebugContext (http://localhost:8100/build/vendor.js:15093:42)
at Object.debugHandleEvent [as handleEvent] (http://localhost:8100/build/vendor.js:14680:12)
at dispatchEvent (http://localhost:8100/build/vendor.js:10057:25)
at http://localhost:8100/build/vendor.js:10671:38
at HTMLButtonElement. (http://localhost:8100/build/vendor.js:36353:53)
at t.invokeTask (http://localhost:8100/build/polyfills.js:3:15660)
at Object.onInvokeTask (http://localhost:8100/build/vendor.js:4973:33)My source code is as follows:
home.ts:
import { Component } from '@angular/core'; import { NavController } from 'ionic-angular'; import { FirstPage } from '../first/first'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { image = "../../assets/imgs/IMG3.jpg"; constructor(public navCtrl: NavController) { } openFirstPage(){ image = "../../assets/imgs/IMG4.jpg"; console.log('click') } }
home.html:
<ion-header> <ion-navbar> <ion-title> Ionic Blank </ion-title> </ion-navbar> </ion-header> <ion-content padding> The world is your oyster! <button ion-button full color="light" (click)="openFirstPage()">ClickMe</button> <ion-list> <ion-item> <ion-avatar item-start> <img src = {{image}}> </ion-avatar> <h2>Cher</h2> <p>Ugh. As if.</p> </ion-item> </ion-list> </ion-content>
Any suggestions what I am doing wrong? Please note that at the start the variable seems to exist and no error is thrown.
Thanks in advance
Tobias
Posts: 2
Participants: 2