简体   繁体   中英

How to set image url in html from typescript?

I'm building ionic app for wallpaper/gallery.I want app to show wallpaper in full screen when user clicks on a particular image.

Thanks.

HTML code:

<ion-header>
  <ion-navbar color="dark">
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>Walldo</ion-title>
  </ion-navbar>
</ion-header>
<ion-slides zoom="true">
  <ion-slide>
    <div class="swiper-zoom-container">
      <img id="fullwall" src="some link">
    </div>
    <ion-label>Elephant</ion-label>
    <button ion-button round (click)="download('wall.jpg')">Download</button>      
  </ion-slide>
</ion-slides>

TYPESCRIPT code:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';


@IonicPage()
@Component({
  selector: 'page-popular',
  templateUrl: 'popular.html',
})
export class PopularPage {

  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }


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

}

It's a simple property binding:

<img [src]="theWallImageUrl" />

and in the code of the component:

this.theWallImageUrl = ...

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM