[英]Ionic 4 Angular: Uncaught ReferenceError: dismissModal is not defined at HTMLElement.onclick (BUT function IS defined!)
Error: Uncaught ReferenceError: dismissModal is not defined at HTMLElement.onclick
错误:未捕获的 ReferenceError:dismissModal 未在 HTMLElement.onclick 中定义
Match-Summary-Modal.component.html Match-Summary-Modal.component.html
<ion-header translucent>
<ion-toolbar>
<ion-title>Match Summary</ion-title>
<ion-buttons slot="end">
<ion-button onclick="dismissModal()">Return to Queue Page</ion-button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-card>
<ion-card-content>This match you had a score of {{score}}</ion-card-content>
<ion-card-content>And a place of {{place}} out of {{playerCount}} players</ion-card-content>
</ion-card>
</ion-content>
Match-Summary-Modal.component.ts Match-Summary-Modal.component.ts
import { Component, OnInit, Input} from '@angular/core';
import { ModalController } from '@ionic/angular';
@Component({
selector: 'app-match-summary-modal',
templateUrl: './match-summary-modal.component.html',
styleUrls: ['./match-summary-modal.component.scss'],
})
export class MatchSummaryModalComponent implements OnInit {
@Input() score: number;
@Input() place: number;
@Input() playerCount: number;
constructor(private modalController: ModalController) {
}
ngOnInit() {}
async dismissModal() {
this.modalController.dismiss()
}
}
GameNetworkService.ts (somewhere within the service, with modalController injected) GameNetworkService.ts (服务中的某处,注入了 modalController)
this.lobbyServerSocket.on('match-summary', async (summarydata) => {
let modal = await this.modalController.create({
component: MatchSummaryModalComponent,
componentProps: {
score: summarydata.score,
place: summarydata.place,
playerCount: summarydata.playerCount
}
})
await modal.present()
this.lobbyServerSocket.disconnect(true)
this.lobbyServerSocket = null;
})
Question When dismissModal()
is clearly defined within MatchSummaryModal, why is angular/ionic unable to find the dismissModal()
method that is quite clearly called & contained within the component when the button is clicked?问题当在
dismissModal()
中明确定义了dismissModal()
,为什么angular/ionic 无法找到在单击按钮时非常清楚地调用并包含在组件中的dismissModal()
方法?
Additionally, what do I need to do to get the intended functionality?此外,我需要做什么才能获得预期的功能? (Which is to make the modal dismiss itself on button click)
(这是使模态在按钮单击时自行关闭)
Thank you!谢谢!
It should be它应该是
<ion-button (click)="dismissModal()">Return to Queue Page</ion-button>
instead of代替
<ion-button onclick="dismissModal()">Return to Queue Page</ion-button>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.