我正在尝试将此Angular指令降级为AngularJS指令(我们在混合模式下将Angular与AngularJS结合使用,并且仅由于性能问题而降级)
'use strict';
import * as _ from 'lodash';
import * as angular from 'angular';
import * as $ from 'jquery';
import {Directive, ElementRef, EventEmitter, Input, OnDestroy, Output} from '@angular/core';
import {downgradeComponent} from '@angular/upgrade/static';
@Directive({selector: '[gbClickOutside]'})
export class GbClickOutsideDirective implements OnDestroy {
private readonly element;
private readonly listener;
@Output() gbClickOutside = new EventEmitter();
@Input() whitelist;
@Input() blacklist;
@Input() parent;
@Input() includeSelf;
constructor(private el: ElementRef) {
this.element = $(el.nativeElement);
// const clickOutside = $parse(attrs.clickOutside);
this.listener = this.onDocumentMouseDown.bind(this);
$(document).on('mousedown.click_outside', this.listener);
}
onDocumentMouseDown(event) {
const self = this;
// An array of selectors. Any white-listed element will not trigger the click-outside event
const whitelist = this.whitelist || [];
// An array of selectors. Any black-listed element will trigger the click-outside event,
// even if this element is contained within the main container
const blacklist = this.blacklist || [];
// Element to apply whitelist/blacklist on. if not set, whitelist/blacklist will be applied on the document
const parent = this.parent;
const isClickOutsideElement = targetElem => self.element.is(':visible') &&
!targetElem.closest(self.element.children()).length &&
(angular.isDefined(self.includeSelf) || !targetElem.is(self.element));
const isClickElementsInList = (targetElem, selectors) => !_.isEmpty(selectors) &&
selectors.some(selector => (!parent || parent.contains(targetElem.get(0))) &&
(targetElem.is(selector) || targetElem.closest($(selector).children()).length));
const isClickOutsideWhitelistElement = targetElem => !isClickElementsInList(targetElem, whitelist);
const isClickBlacklistElement = targetElem => isClickElementsInList(targetElem, blacklist);
const _targetElem = $(event.target);
if (isClickBlacklistElement(_targetElem) || (isClickOutsideElement(_targetElem) && isClickOutsideWhitelistElement(_targetElem))) {
$(document).on('mouseup.click_outside', e => {
$(document).off('mouseup.click_outside');
if (e.target === event.target) {
self.gbClickOutside.emit({$event: event});
}
});
}
}
ngOnDestroy() {
$(document).off('mousedown.click_outside', this.listener);
}
}
但是我找不到有关将属性指令降级到angularjs的任何信息
我该如何实现?