Угловая ссылка на элемент при нажатии - PullRequest
0 голосов
/ 16 апреля 2019

Мне нужно получить ссылку на угловой компонент, связанный с любым элементом, на который я щелкаю мышью в своем приложении Angular.

IE: я щелкаю в любом месте экрана и мне нужно получить ссылку на ближайший угловой компонент (который был создан в моем приложении, а не node_modules) и его внутренние переменные.Я полагаю, что мне нужно каким-то образом запросить дерево углового обзора, чтобы получить это, но я не уверен, с чего начать или возможно ли это даже дистанционно.

Что я пробовал?

export class XComponent implements OnInit {
    @HostListener('document:click', ['$event']) handleClick($event) {
        let clickedComponent: Node = $event.target;
        let inside: boolean = false;

        do {
            if ( clickedComponent.localName && clickedComponent.localName.substr( 0, 4 ) === "app-" ) {
                this.analyzeActiveNode( clickedComponent );
                break;
            }

            clickedComponent = clickedComponent.parentNode;
        } while (clickedComponent);
    }

    analyzeActiveNode( _node: Node ) {
        //Somehow get the component and preferrably it's THIS context, that relates to this _node
    }
}

Короче говоря, этот код рекурсивно перемещается по дереву DOM, пока не найдет узел DOM, селектор которого начинается с 'app-', что является псевдокодом для моего префикса компонента Angular.Затем, после того как я найду этот DOM-узел, мне нужно каким-то образом извлечь из него ссылку на Angular-компонент.

Помните, что компонент X, на котором прослушиваются все щелчки, может жить в любом месте приложения, поэтому использование ViewChild / ViewChildren не вариант.

PS.Этот код предназначен для образовательных целей, и я не пытаюсь придерживаться шаблонов углового дизайна с ним.Он не предназначен для производственной среды, а используется нашими разработчиками внутри компании.

...