d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { ThyGuiderManager } from './guider-manager';
import { AfterViewInit, Directive, ElementRef, Input, OnDestroy, OnInit, NgZone } from '@angular/core';
import { take } from 'rxjs/operators';

/**
 * 标记新手引导的步骤的target，使用指令方式的新手引导支持多路由跳转
 * @name thyGuiderTarget
 * @order 40
 */
@Directive({
    selector: '[thyGuiderTarget]',
    exportAs: 'thyGuiderTarget',
    standalone: true
})
export class ThyGuiderTargetDirective implements OnInit, OnDestroy, AfterViewInit {
    /**
     * 标记当前元素对应的新手引导中 step 的 key
     */
    @Input('thyGuiderTarget')
    target: string;

    constructor(private guiderManager: ThyGuiderManager, private el: ElementRef, private ngZone: NgZone) {}

    ngOnInit() {
        this.guiderManager.addStepTarget(this.target, this.el.nativeElement);
        this.ngZone.onStable.pipe(take(1)).subscribe(() => {
            const { key, guiderRef } = this.guiderManager.getActive();
            if (key === this.target) {
                const index = guiderRef.steps.findIndex(step => step.key === this.target);
                this.ngZone.run(() => {
                    guiderRef.active(index);
                });
            }
        });
    }

    ngAfterViewInit() {}

    ngOnDestroy() {
        const { guiderRef } = this.guiderManager.getActive();
        if (guiderRef) {
            guiderRef.close();
        }
        this.guiderManager.removeStepTarget(this.target);
    }
}

1	import { ThyGuiderManager } from './guider-manager';
2	import { AfterViewInit, Directive, ElementRef, Input, OnDestroy, OnInit, NgZone } from '@angular/core';
3	import { take } from 'rxjs/operators';
4
5	/**
6	* 标记新手引导的步骤的target，使用指令方式的新手引导支持多路由跳转
7	* @name thyGuiderTarget
8	* @order 40
9	*/
10	@Directive({	1✔
11	selector: '[thyGuiderTarget]',
12	exportAs: 'thyGuiderTarget',	×
13	standalone: true	×
14	})	×
15	export class ThyGuiderTargetDirective implements OnInit, OnDestroy, AfterViewInit {
16	/**
17	* 标记当前元素对应的新手引导中 step 的 key	×
18	*/	×
19	@Input('thyGuiderTarget')	×
20	target: string;	×
21		×
22	constructor(private guiderManager: ThyGuiderManager, private el: ElementRef, private ngZone: NgZone) {}	×
23		×
24	ngOnInit() {
25	this.guiderManager.addStepTarget(this.target, this.el.nativeElement);
26	this.ngZone.onStable.pipe(take(1)).subscribe(() => {
27	const { key, guiderRef } = this.guiderManager.getActive();
28	if (key === this.target) {
29	const index = guiderRef.steps.findIndex(step => step.key === this.target);
30	this.ngZone.run(() => {	×
31	guiderRef.active(index);	×
32	});	×
33	}
34	});	×
35	}
36		1✔
37	ngAfterViewInit() {}
38
39	ngOnDestroy() {
40	const { guiderRef } = this.guiderManager.getActive();
41	if (guiderRef) {	1✔
42	guiderRef.close();
43	}
44	this.guiderManager.removeStepTarget(this.target);
45	}	1✔
46	}

atinc / ngx-tethys / d9ae709b-3c27-4b69-b125-b8b80b54f90b

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous