Ошибка машинописного текста: TS2314: универсальный тип 'ElementRef'требует 2 типа аргумента (ов) - PullRequest
0 голосов
/ 05 июня 2018

Я использую шаблон Angular 5.x, но я обновляю его до Angular 6, используя руководство https://update.angular.io/.Теперь у меня есть эта ошибка в моем конструкторе

Typescript Error: TS2314: Generic type 'ElementRef<T, any>' requires 2 type argument(s)

Мой код:

import { Component, Input, Output, EventEmitter, ElementRef, HostListener }          from '@angular/core';

@Component({
  selector: 'sidebar',
  templateUrl: './sidebar.component.html'
})

export class SidebarComponent {

    @HostListener('document:click', ['$event'])
  clickout(event) {
    if(!this.eRef.nativeElement.contains(event.target)) {
          this.hideMobileSidebar.emit(true);
    }
  }

  constructor(private eRef: ElementRef) {
  }

...

У меня нет этой ошибки в предыдущей версии Angular 5.

Что былоизменение?Я не понимаю документы :( https://angular.io/api/core/ElementRef

Ответы [ 2 ]

0 голосов
/ 25 июня 2018

Я исправляю проблему.

Я просто запустил npm i @angular-cli --save, и он изменился с версии 6.0.7 на 6.0.8, я также обновил его глобально.Затем я запускаю ng update @angular/cli, но это ничего не меняет в моем package.json.Теперь я могу использовать только ElementRef или ElementRef<HTMLElement> или ElementRef<HTMLElement, any>, ВСЕ РАБОТАЕТ СЕЙЧАС.Я не понимаю, что angular-cli имеет отношение к моей установке tslint или typcript, но это единственное, что я сделал.

0 голосов
/ 05 июня 2018

Они изменили свойство nativeElement с any на универсальный тип .

Если вы хотите быстро исправить, то измените eRef: ElementRef на eRef: ElementRef<any>, чтото же, что и в предыдущих версиях.

Это изменение означает, что теперь вы можете определить тип класса для элемента DOM, на который ссылается.Это поможет компиляции TypeScript реализовать этот тип, а также функции автозаполнения IDE.

Существует много различных типов классов, но базовый класс Элемент используется для большинства элементов DOM.Если вы знаете, что это будет элемент <input>, вы можете использовать HTMLInputElement в качестве примера.

В вашем примере компонент внедряет свой элемент DOM для конструктора.Что будет общим HTMLElement .Таким образом, код будет обновлен так:

constructor(private eRef: ElementRef<HTMLElement>) {
     const title = eRef.nativeRef.title;
     // ^^^ the above title property is now verified by TypeScript at compile-time
}
...