我有以下代码的 typescript 文件
import { Component } from '@angular/core';
import { CoreConfig } from '@services/config';
import { CoreUtils } from '@services/utils/utils';
import { CoreLoginHelperProvider } from '@features/login/services/login-helper';
import { ModalController } from '@singletons';
/**
* Component that displays onboarding help regarding the CoreLoginSitePage.
*/
@Component({
selector: 'core-login-site-onboarding',
templateUrl: 'site-onboarding.html',
styleUrls: ['site-onboarding.scss', '../../login.scss'],
})
export class CoreLoginSiteOnboardingComponent {
step = 0;
/**
* Go to next step.
*
* @param e Click event.
*/
next(e: Event): void {
e.stopPropagation();
this.step++;
}
/**
* Go to previous step.
*
* @param e Click event.
*/
previous(e: Event): void {
e.stopPropagation();
if (this.step == 0) {
ModalController.dismiss();
} else {
this.step--;
}
}
/**
* Close modal.
*
* @param e Click event.
*/
skip(e: Event): void {
e.stopPropagation();
this.saveOnboardingDone();
ModalController.dismiss();
}
/**
* Create a site.
*
* @param e Click event.
*/
gotoWeb(e: Event): void {
e.stopPropagation();
this.saveOnboardingDone();
CoreUtils.openInBrowser('https://moodle.com/getstarted/', { showBrowserWarning: false });
ModalController.dismiss();
}
/**
* Saves the onboarding has finished.
*/
protected saveOnboardingDone(): void {
CoreConfig.set(CoreLoginHelperProvider.ONBOARDING_DONE, 1);
}
}
这是HTML代码
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-button fill="clear" (click)="previous($event)" [attr.aria-label]="'core.back' | translate">
<ion-icon slot="icon-only" name="fas-arrow-left" aria-hidden="true"></ion-icon>
</ion-button>
</ion-buttons>
<ion-title></ion-title>
<ion-buttons slot="end">
<ion-button fill="clear" (click)="skip($event)" [attr.aria-label]="'core.skip' | translate">
{{'core.skip' | translate}}
</ion-button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding">
<div>
<div class="ion-text-center ion-padding core-login-site-logo">
<img src="assets/img/login_logo.png" class="avatar-full login-logo" role="presentation" alt="">
</div>
<h3 class="core-login-onboarding-step">
{{'core.login.onboardingwelcome' | translate}}
</h3>
<div *ngIf="step == 0" class="core-login-onboarding-step">
<ion-button expand="block" (click)="skip($event)" class="ion-margin-bottom" fill="outline">
{{'core.login.onboardingimalearner' | translate}}
</ion-button>
<ion-button expand="block" (click)="next($event)" class="ion-margin-bottom" fill="outline">
{{'core.login.onboardingimaneducator' | translate}}
</ion-button>
</div>
<div *ngIf="step == 1" class="core-login-onboarding-step">
<p class="core-login-onboarding-text">
{{ 'core.login.onboardingtoconnect' | translate }}
</p>
<ion-button expand="block" (click)="skip($event)" class="ion-margin-bottom" fill="outline">
{{ 'core.login.onboardingialreadyhaveasite' | translate }}
</ion-button>
<ion-button expand="block" (click)="next($event)" class="ion-margin-bottom">
{{ 'core.login.onboardingineedasite' | translate }}
</ion-button>
</div>
<div *ngIf="step == 2" class="core-login-onboarding-step">
<ul class="core-login-onboarding-text ion-text-start">
<li>
<ion-icon name="far-check-circle" aria-hidden="true">
</ion-icon> {{ 'core.login.onboardingcreatemanagecourses' | translate }}
</li>
<li>
<ion-icon name="far-check-circle" aria-hidden="true">
</ion-icon> {{ 'core.login.onboardingenrolmanagestudents' | translate }}
</li>
<li>
<ion-icon name="far-check-circle" aria-hidden="true">
</ion-icon> {{ 'core.login.onboardingprovidefeedback' | translate }}
</li>
</ul>
<ion-button expand="block" (click)="gotoWeb($event)" class="ion-margin-bottom">
{{ 'core.login.onboardinggetstarted' | translate }}
</ion-button>
</div>
</div>
</ion-content>
我想通过调用类顶部的skip方法跳过此页,而不单击按钮
怎么做呢?
1条答案
按热度按时间nwlls2ji1#
按照@Kaddath的建议,如下所示更改skip方法定义
在类构造函数中,这将是第一个被执行的方法,你需要调用skip方法。
希望这对你有帮助。