Использование пользовательской директивы в моделях ioni c

Question

У меня есть эта директива об автоматическом размере ion-textarea :

import { Directive, HostListener, ElementRef } from '@angular/core';

@Directive({
  selector: 'ion-textarea[autosize]'
})
export class AutoResizeTextareaDirective {
  readonly defaultHeight = 64;

  @HostListener('input', ['$event.target'])
  onInput(textArea: HTMLTextAreaElement) {
    this.adjust(textArea);
  }

  constructor(private element: ElementRef) {}

  ngAfterViewInit() {
    this.adjust();
  }

  adjust(textArea?: HTMLTextAreaElement) {
    textArea = textArea || this.element.nativeElement.querySelector('textarea');

    if (!textArea) {
      return;
    }

    textArea.style.overflow = 'hidden';
    textArea.style.height = 'auto';
    textArea.style.height =
      (textArea.value ? textArea.scrollHeight : this.defaultHeight) + 'px';
  }
}

В моем modal.component. html:

<ion-textarea autosize [(ngModel)]="message.msg_text"></ion-textarea>

Директива была также добавлена ​​к моему app.module.ts. Кажется, это не работает, потому что я подозреваю, что это тот факт, что поле находится в модальном режиме. Как бы заставить это работать на модале, так как модал не содержит .module.ts файл

Answer 1

Мне удалось найти решение. Вместо добавления директивы в объявления app.module.ts объявите ее в файле module.ts страницы, которую вы открываете модальным из

Answer 2

Похоже, что ваша проблема заключалась в том, что вы назвали, см. Этот пример:

import { Directive } from '@angular/core';

@Directive({
  selector: '[appHighlight]'
})
export class HighlightDirective {
  constructor() { }
}

---
<p appHighlight>Highlight me!</p>

Ваш селектор, я думаю, должен быть: [autosize] вместо 'ion-textarea[autosize]'.

Возьмите смотрите: Angular Справочник по атрибутам