word-position.directive.ts
View Options

			import { Directive, ElementRef, HostBinding, HostListener, Input } from '@angular/core';
			import { WordService } from '../services/field-interaction.service';
			import { Word } from '../models/word';

			@Directive({
			selector: '[interactedWord]'
			})
			export class WordPositionDirective {
			@Input('interactedWord') interactedWord: Word;

			constructor(private wordserice: WordService) {}

			@HostListener('click') onMouseClick() {
			// alert(this.word);
			this.wordserice.updateInfo(this.interactedWord);
			this.wordserice.onClickService(this.interactedWord);
			}

			@HostListener('mouseenter') onMouseEnter() {
			this.wordserice.mouseEnterService(this.interactedWord);
			}

			@HostListener('mouseleave') onMouseLeave() {
			this.wordserice.mouseLeaveService(this.interactedWord);
			}

			}

svg-test-app/src/app/textfield-component/word-position.directive.tsff0cc1fadc54master