Ошибка TS2315: тип "ElementRef" не является общим материалом угловой

Question

ОШИБКА в node_modules/@angular/material/button-toggle/typings/button-toggle.d.ts (136,20):

ошибка TS2315: тип 'ElementRef' не является универсальным.

node_modules/@angular/material/button-toggle/typings/button-toggle.d.ts (154,104):

ошибка TS2315: тип 'ElementRef' не является универсальным

Я пытаюсь установить материал, но похоже, что это ошибка.

DATA:

Angular CLI: 1.7.4
Node: 9.11.1

Answer 1

Эта ошибка возникает в случае несоответствия в вашей угловой версии и версии материала. Чтобы увидеть ошибку, перейдите в файл package.json, где вы можете найти угловую версию и версию материала.

  "dependencies": {
"@angular/animations": "^5.2.0",
"@angular/cdk": "^6.2.1",              //ERROR here the version is 6.x
"@angular/common": "^5.2.0",
"@angular/compiler": "^5.2.0",
"@angular/core": "^5.2.0",
"@angular/forms": "^5.2.0",
"@angular/http": "^5.2.0",
"@angular/material": "^6.2.1",         // ERROR here the material version is 6.x
"@angular/platform-browser": "^5.2.0",
"@angular/platform-browser-dynamic": "^5.2.0",
"@angular/router": "^5.2.0",
"core-js": "^2.4.1",
"hammerjs": "^2.0.8",
"rxjs": "^5.5.6",
"zone.js": "^0.8.19"}

},

Как вы можете видеть в приведенном выше файле package.json, существует несоответствие версии. Есть два способа решить эту ошибку:

1. Обновите свой угловой с помощью команды: ng update ( изменит ваш угловой вариант на 6.x ).
2. Измените версию cdk и материала на 5.2.0 вручную , затем введите команду: npm install это добавит материал версии 5.2.0

Answer 2

Лучший способ здесь - это изменить все ваши материальные зависимости, чтобы они соответствовали угловым, для тех из вас, у кого есть угловой 5.2.0.какой бы ни была текущая версия других угловых компонентов.

FINAL

"dependencies": {
  "@angular/core": "^5.2.0",
  "@angular/cdk": "^5.2.0",
  "@angular/material": "^5.2.0"    
}

THEN do npm install

Answer 3

Это происходит, когда вся ваша угловая упаковка в одной версии и упаковка материала в другой версии.

Я столкнулся с этим, когда моя угловая версия пакета была 5,2, а версия материала была 6,0 поэтому я изменил версию материала обратно на 5.1, и проблема исправлена.

Answer 4

ОК, вот как я это исправил: Шаг первый:

• пробег npm update -D и npm update -S Но я не думаю, что это было необходимо, потому что проблема все еще была там.

Шаг буксировки:

npm install -g @angular/cli@latest
ng update

Команда жаловалась, что мне нужно бежать (так я и сделал):

ng update @angular/cli

После попытки: ng serve Я получил ошибку, так как 'hammerjs' не был установлен, поэтому я запускаю (но это может быть не ваш случай):

npm install hammerjs --save

и npm install @types/hammerjs --save-dev

Я не понимаю смысла --save-dev, но я сделал это таким образом. Это компилируется сейчас.

Эта последняя вещь Хаммерджса была найдена здесь: Модуль не найден: ошибка: не удается разрешить «hammerjs»

Надеюсь, это поможет.

Answer 5

Может быть, это связано с angular 1.6, который только что вышел?

У меня та же проблема, но я просто не могу понять, как обновить ее остаток (вместо того, чтобы понизить одну версию, обновите все остальное)вещь), но я не могу понять это.

Пробовал npm update -D, а затем npm update -S Но это не помогло.

Эта идея пришла от: Я новичокугловой.Я только что установил угловой материал и угловую анимацию в своем небольшом проекте и получил некоторые ошибки

Answer 6

У меня были те же проблемы, но работало снижение моего @ angular / material до версии 5.0. Вы можете попробовать это.