Question

我正在尝试给指令提供对其元素的引用，但无法在构造函数中传递它。真正奇怪的是，在同一个项目中，我有一个不同的指令，确实通过构造函数对其元素进行了引用。

我尝试了很多不同的方法：

首先，在项目中其他地方使用不同指令的指令：

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

@Directive({
  selector: 'dialog[openable]'
})
export class OpenableDirective {
  constructor (private readonly element: ElementRef) { }
}

好吧，也许它不能是只读的：

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

@Directive({
  selector: 'dialog[openable]'
})
export class OpenableDirective {
  constructor (private element: ElementRef) { }
}

让我们尝试public：

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

@Directive({
  selector: 'dialog[openable]'
})
export class OpenableDirective {
  constructor (public element: ElementRef) { }
}

好吧，怎么做呢？

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

@Directive({
  selector: 'dialog[openable]'
})
export class OpenableDirective {
  private element: ElementRef;
  constructor (e: ElementRef) {
    this.element = e;
  }
}

这些都无法通过相同的错误消息进行编译：

ERROR in /path/to/src/app/directives/openable.directive.spec.ts
[tsl] ERROR in /path/to/src/app/directives/openable.directive.spec.ts(5,23)
      TS2554: Expected 1 arguments, but got 0.
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! my-app@0.0.1 autonomous:build: `npm run build:client-and-server-bundles && webpack --config webpack.server.config.js --no-progress --no-colors`
npm ERR! Exit status 2

当然，您会注意到第5行不仅没有23列，而且也不是错误的出处。我知道这是因为此代码：

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

@Directive({
  selector: 'dialog[openable]'
})
export class OpenableDirective {
  constructor () { }
}

编译良好。

为什么这个坏了？为什么在其他地方可以使用？

无法将属性传递给角度指令构造函数

0 个答案: