离子3指令不起作用

Question

我一直试图在离子中创建一个指令,它只是不工作,我似乎不知道为什么.我希望指令允许自动调整大小.因此,当它有更多的文本时,它只是不断调整大小.

这是我的代码:我的项目是一个离子3项目,使用角度4,新版本.

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

@Directive({
  selector: '[auto-resize-text-input]' // Attribute selector
})
export class AutoResizeTextInput {
  constructor(public elem: ElementRef) {
    console.log('Hello AutoResizeTextInput Directive');
  }

  @HostListener('input', ['$event.target']) onInput() {
    this.resizeTextOnInput();
  }

  private resizeTextOnInput() {
    this.elem.nativeElement.style.overflow = 'hidden';
    this.elem.nativeElement.style.height = 'auto';
    this.elem.nativeElement.style.height = this.elem.nativeElement.scrollHeight + "px";
  }
}

请帮忙 ？？？？

Answer 1

我有同样的问题。该应用程序未识别该指令，但未给出任何错误。所以我将其从主模块中删除，decalarations并添加到页面模块中decalarations，该模块使用了指令，问题解决了。

Answer 2

如果您将指令文件放在组件文件夹中。这是答案：

将文件从 移动 components/your-directive 到 directives/your-directive 然后重建它。祝你好运！