Question

我有两种警报-次要警报和延迟警报首先显示辅助警报消息，用户必须单击“确定”按钮将其关闭。

但是也有延迟的警报..由setTimeout()触发当此延迟警报显示给用户时，我正在尝试自动关闭辅助警报

我试图消除这种次要警报

this.secondaryAlertVar.dismiss();

但是它不起作用。

这是代码

import { Component, OnInit } from "@angular/core";
import * as dialogs from "tns-core-modules/ui/dialogs";
@Component({
    selector: "Home",
    moduleId: module.id,
    templateUrl: "./home.component.html",
    styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {

    secondaryAlertVar: any;
    constructor() {
        this.secondaryAlerts(function () { }, 0, "Hhmm... ", "Alert");

        setTimeout(() => {
            this.delayedAlertBox("All other alerts should close automatically when this triggered");
        }, 10000);
    }

    ngOnInit() {
    }

    secondaryAlerts(callback, mode, message, title): any {
      this.secondaryAlertVar =  dialogs
            .alert({
                title: title,
                message: message,
                cancelable: false,
                okButtonText: "OK"
            })
            .then(callback);
    }

    delayedAlertBox(message) {
        this.secondaryAlertVar.dismiss();
        var options = {
            title: "Delayed Alert",
            message: message,
            okButtonText: "Ok",
            cancelable: false,
        };
        dialogs.alert(options).then(() => {
        });
    }
}

Playground Link

Answer 1

尝试使用rxjs可以实现此目的。

import { Component, OnInit } from "@angular/core";
import * as dialogs from "tns-core-modules/ui/dialogs";
import { interval, timer } from 'rxjs';
import { takeUntil } from 'rxjs/operators'
@Component({
    selector: "Home",
    moduleId: module.id,
    templateUrl: "./home.component.html",
    styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {

      source = interval(0);
      alive = true;
      secondaryAlertVar: any;

      constructor() {

       const example = this.source.pipe(takeWhile(() => this.alive));
       const subscribe = example.subscribe(val => {
        this.secondaryAlerts(function () { }, 0, "Hhmm... ", "Alert");
       });

        setTimeout(() => {
        this.alive = false;
            this.delayedAlertBox("All other alerts should close automatically when this triggered");
        }, 10000);
    }

    ngOnInit() {
    }

    secondaryAlerts(callback, mode, message, title): any {
      this.secondaryAlertVar =  dialogs
            .alert({
                title: title,
                message: message,
                cancelable: false,
                okButtonText: "OK"
            })
            .then(callback);
    }

    delayedAlertBox(message) {
        this.secondaryAlertVar.dismiss();
        var options = {
            title: "Delayed Alert",
            message: message,
            okButtonText: "Ok",
            cancelable: false,
        };
        dialogs.alert(options).then(() => {
        });
    }
}

触发新警报时以角度编程方式关闭警报

1 个答案: