d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { Directive, ElementRef, Input, NgZone, OnDestroy } from '@angular/core';
import { fromEvent, Observable, Subject } from 'rxjs';
import { startWith, switchMap, takeUntil } from 'rxjs/operators';

/**
 * 阻止事件冒泡
 * @name thyStopPropagation
 */
@Directive({
    selector: '[thyStopPropagation]',
    standalone: true
})
export class ThyStopPropagationDirective implements OnDestroy {
    private _eventName = 'click';

    private _shouldStopPropagation = true;

    @Input()
    set thyStopPropagation(value: string | boolean) {
        if (value === false || value === 'false') {
            this._shouldStopPropagation = false;
        } else {
            this._shouldStopPropagation = true;
            if (!value || value === true || value === 'true') {
                this._eventName = 'click';
            } else {
                this._eventName = value as string;
            }
        }

        this._changes$.next();
    }

    private _changes$ = new Subject<void>();
    private _destroy$ = new Subject<void>();

    constructor(_host: ElementRef<HTMLElement>, _ngZone: NgZone) {
        this._changes$
            .pipe(
                // Note: we start the stream immediately since the `thyStopPropagation` setter may never be reached.
                startWith<null, null>(null),
                switchMap(
                    () =>
                        new Observable<Event>(subscriber =>
                            _ngZone.runOutsideAngular(() => fromEvent(_host.nativeElement, this._eventName).subscribe(subscriber))
                        )
                ),
                takeUntil(this._destroy$)
            )
            .subscribe(event => {
                if (this._shouldStopPropagation) {
                    event.stopPropagation();
                }
            });
    }

    ngOnDestroy() {
        this._destroy$.next();
    }
}

1	import { Directive, ElementRef, Input, NgZone, OnDestroy } from '@angular/core';
2	import { fromEvent, Observable, Subject } from 'rxjs';
3	import { startWith, switchMap, takeUntil } from 'rxjs/operators';
4
5	/**
6	* 阻止事件冒泡
7	* @name thyStopPropagation
8	*/
9	@Directive({	1✔
10	selector: '[thyStopPropagation]',
11	standalone: true	×
12	})	×
13	export class ThyStopPropagationDirective implements OnDestroy {
14	private _eventName = 'click';
15		×
16	private _shouldStopPropagation = true;	×
17		×
18	@Input()
19	set thyStopPropagation(value: string \| boolean) {
20	if (value === false \|\| value === 'false') {	×
21	this._shouldStopPropagation = false;
22	} else {
23	this._shouldStopPropagation = true;	×
24	if (!value \|\| value === true \|\| value === 'true') {
25	this._eventName = 'click';
26	} else {	×
27	this._eventName = value as string;	×
28	}	×
29	}	×
30		×
31	this._changes$.next();
32	}
33		×
34	private _changes$ = new Subject<void>();
35	private _destroy$ = new Subject<void>();	×
36		×
37	constructor(_host: ElementRef<HTMLElement>, _ngZone: NgZone) {
38	this._changes$
39	.pipe(
40	// Note: we start the stream immediately since the `thyStopPropagation` setter may never be reached.
41	startWith<null, null>(null),	×
42	switchMap(
43	() =>	1✔
44	new Observable<Event>(subscriber =>
45	_ngZone.runOutsideAngular(() => fromEvent(_host.nativeElement, this._eventName).subscribe(subscriber))
46	)
47	),	1✔
48	takeUntil(this._destroy$)
49	)
50	.subscribe(event => {
51	if (this._shouldStopPropagation) {	1✔
52	event.stopPropagation();
53	}
54	});
55	}
56
57	ngOnDestroy() {
58	this._destroy$.next();
59	}
60	}

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