离子 2 警报在网页上不起作用
ionic 2 Alert not working on webpage
当设备没有摄像头时,我想在 Ionic2 上发出警报。
当我启动时:ionic serve
然后我尝试显示如下消息:
let alert = Alert.create({
title: 'Camera not found',
subTitle: 'It seems your camera is not working on your device',
buttons: ['Ok']
});
this.nav.present(alert);
我有一个 javascript 错误
Uncaught EXCEPTION: Error during evaluation of "click"
ORIGINAL EXCEPTION: TypeError: rootNav.getActive is not a function
ORIGINAL STACKTRACE:
TypeError: rootNav.getActive is not a function
at Tab.NavController.present (http://localhost:8100/build/js/app.bundle.js:46996:36)
at SmartScan.takePicture (http://localhost:8100/build/js/app.bundle.js:60864:23)
at AbstractChangeDetector.ChangeDetector_SmartScan_0.handleEventInternal (eval at <anonymous> (http://localhost:8100/build/js/app.bundle.js:14578:17), <anonymous>:185:36)
at AbstractChangeDetector.handleEvent (http://localhost:8100/build/js/app.bundle.js:13892:25)
at AppView.dispatchEvent (http://localhost:8100/build/js/app.bundle.js:18772:46)
at AppView.dispatchRenderEvent (http://localhost:8100/build/js/app.bundle.js:18766:22)
at DefaultRenderView.dispatchRenderEvent (http://localhost:8100/build/js/app.bundle.js:33592:39)
at eventDispatcher (http://localhost:8100/build/js/app.bundle.js:33258:22)
at http://localhost:8100/build/js/app.bundle.js:33329:40
在alert.js中:
import {Page, Alert, NavController} from 'ionic-angular';
@Page({
templateUrl: 'build/pages/alert/alert.html'
})
export class AlertPage {
static get parameters() {
return [[NavController]];
}
constructor(nav) {
this.nav = nav;
}
showAlert() {
let alert = Alert.create({
title: 'New Friend!',
subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
buttons: ['Ok']
});
this.nav.present(alert);
}
}
在alert.html中:
<button block dark (click)="showAlert()">test</button>
好像还没有准备好...
调查代码
this.nav.present(alert);
路过这里 returns :
if (rootNav['_tabs']) {
// TODO: must have until this goes in
// https://github.com/angular/angular/issues/5481
void 0;
return;
}
我也在研究 ionic2,并且需要在我现有的应用程序中实现 "PopUp" window。 我为此尝试了很多,但没有完成我的任务,最后我做了这样的事情-
pop-up.html
<button block dark (click)="showAlert()">Help Window</button>
pop-up.ts
import { Component } from '@angular/core'; import { Alert, NavController, NavParams} from 'ionic-angular'; @Component({ templateUrl: 'build/pages/pop-up/pop-up.html', }) export class PopUpPage { static get parameters() { return [[NavController]]; } constructor(private nav: NavController) { this.nav = nav; } showAlert() { let alert = Alert.create({ title: 'Help Window!', subTitle: 'Mindfulness is here for you and your soul. We are intended to stablish your connection to All Mighty.', buttons: ['Cancle'] }); this.nav.present(alert); } }
这对我来说很好用。
希望它也对你有用。
试试这个:
具有这种文件夹和文件结构
在:
home.html
<ion-header>
<ion-navbar>
<ion-title>Ionic 2 Notifications</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<button block dark (click)="showAlert()">Alert</button>
</ion-content>
在:
home.ts
import {Component} from "@angular/core";
import {NavController, AlertController} from 'ionic-angular';
@Component({
templateUrl: 'home.html'
})
export class HomePage {
constructor(public alertCtrl: AlertController) {
}
showAlert() {
let alert = this.alertCtrl.create({
title: 'New Friend!',
subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
buttons: ['OK']
});
alert.present();
}
}
我从文档站点获得了以下信息: https://ionicframework.com/docs/v2/components/#action-sheets