@arynshaikh wrote:
import { Component } from ‘@angular/core’;
import { IonicPage, Platform, NavParams, ViewController, AlertController, NavController } from ‘ionic-angular’;
import { ImagesPage } from ‘…/images/images’;@IonicPage()
@Component({
selector: ‘page-card’,
templateUrl: ‘card.html’,
template: `
ModalPage
<button ion-button (click)=“closeModal()”>
Cancel
<ion-card no-padding class="card"> <img id="img1" src="{{cara.image}}" (click)="imgs()"> <ion-card-content> <div> <ion-grid> <ion-row> <ion-col>{{Header}}</ion-col> <ion-col> <ion-icon ios="ios-create" md="md-create" (click)="showPrompt('heed')"></ion-icon> </ion-col> </ion-row> </ion-grid> </div> <div> <ion-grid> <ion-row> <ion-col>{{Details}}</ion-col> <ion-col> <ion-icon ios="ios-create" md="md-create" (click)="showPrompt('deet')"></ion-icon> </ion-col> </ion-row> </ion-grid> </div> </ion-card-content> </ion-card>
`
})
export class CardPage {cara;
Header:String=‘Give heading’
Details:String=‘Give Details in paragraph’constructor (
public platform: Platform,
public params: NavParams,
public navCtrl: NavController,
public viewCtrl: ViewController,
public alertCtrl: AlertController
) {var caard = [ { image: 'assets/icon.png', Header: 'World Happiness Report 2017:Top 10 Happiest Contries in the World', Details: 'The most popular industrial group ever, and largely' } ]; this.cara = caard[this.params.get('charNum')];
}
imgs() {
this.navCtrl.push(ImagesPage,{})
}closeModal() {
this.viewCtrl.dismiss();
}showPrompt(title) {
let prompt = this.alertCtrl.create({
title: heed,
inputs: [
{
name: ‘heed’,
value: “”+this.Header
}
],
buttons: [
{
text: ‘Save’,
handler: data => {
console.log(‘Saved clicked’+JSON.stringify(data));
this.Header=data.heed;
}
}
]
});
prompt.present();
}}
Posts: 1
Participants: 1