我在以下代码中：
home.html
<button (click)="doAlert()" color="primary" ion-button small round>
<div><span float-right> {{ meetingTimes.meeting1 }} </span></div>
</button>
home.ts
doAlert() {
let meetingTime = this.alerCtrl.create({
title: 'Weekly Meeting Times',
message: 'Meeting 1 time:' {{ meetingTimes.meeting1 }},
buttons: ['Close']
});
meetingTime.present()
}
在home.html该{{ meetingTimes.meeting1 }}作品不错，但我怎么显示点击时在doAlert方法/使用相同的值？
我知道我不能{{ meetingTimes.meeting1 }}在组件中使用它，但是正确的方法是什么？
我已经尝试过：message: 'Meeting 1 time:' + meetingTimes.meeting1,但这没有用。
您可以使用来做ModalContoller。您可以从打开另一页作为模式对话框home.html。让我们得到的页面是modal.html。
modal.html
<div id="container">
<ion-content padding>
<p class="message">{{message}}</p>
<button ion-button color="danger" (click)="close()">OK</button>
</ion-content>
</div>
模态
#container {
margin: 100px 50px;
height: 120px;
box-shadow: -3px -4px 12px 6px rgba(0, 0, 0, 0.4);
}
button {
float: right;
margin-bottom: 20px;
}
.message {
color: red;
font-weight: bold;
}
ModalPage.ts
export class ModalPage {
message: string;
constructor(
private viewCtrl: ViewController,
private navParams: NavParams) {
this.message = this.navParams.get('message');
}
close() {
this.viewCtrl.dismiss();
}
}
现在，您可以从home.html中以对话框形式打开modal.html，如下所示。
export class HomePage {
constructor(private modalCtrl: ModalController) {}
doAlert()() {
let myModal = this.modalCtrl.create(ModalPage, { message: `Meeting 1 time: ${this.meetingTimes.meeting1}`});
myModal.present();
}
}
我认为这会对您有所帮助。在这里找到工作演示
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句