Angular问题03 @angular/material版本问题

1 问题描述

  应用使用 angular4在使用@angular/material时,若果在导入模块时使用mat开头,就会报错。

2 问题原因

  @angular/material版本出现问题,@angular/material 从版本5开始就必须要angular5的核心依赖;想要在angular5之前版本中的应用中使用@angular/material,要么更改@angular/material的版本(降低版本),例如:cnpm i --save @angular/[email protected],要么更改@angular/core的版本(@angular/material的版本需要angular5支持时),例如:npm install @angular/[email protected] --save 或者修改 package.json 中的文件angular/core版本然后执行 npm install。

  坑01:不知道从哪个版本开始@angular/material中的模块名称的前缀从md改成了mat;修改之前@angular/material 模块的前缀必须是 md 开头的,例如:MdButtonModule;修改之后 @angular/material 模块的前缀必须是 mat 开头的,例如:MatButtonModule。

  技巧01:利用angular5创建项目,执行 npm install --save @angular/material 时就会下载对应的版本。

3 问题解决

  要么修改@angular/material版本,要么修改@angular/core版本

原文地址:https://www.cnblogs.com/NeverCtrl-C/p/8458427.html

时间: 2024-10-12 17:22:30

Angular问题03 @angular/material版本问题的相关文章

使用Angular CLI创建Angular 2项目

一.安装nvm-windows,方便node版本切换 nvm list //查看已安装的版本 nvm install 6.11.0 //安装Node.js 6.11.0,因为@angular/cli需要6.9版本以上支持 nvm use 6.11.0 //切换到新安装的版本 二.为npm配置proxy(proxy软件需自行安装) npm config set proxy=http://localhost:1080 npm config set https-proxy=http://localho

Angular - - angular.injector、angular.module

angular.injector 创建一个injector对象, 调用injector对象的方法可用于获取服务以及依赖注入. 格式:angular.injector(modules); modules:  Array 注入的模块(一个或多个). 使用代码: (function () { angular.module("firstModule", []) .service("firstService", function () { this._log = functi

嘿!@野兽,你的ng api 掉了 - - angular.uppercase和angular.lowercase

@野兽的 ng api 学习 -- angular.uppercase和angular.lowercase angular.uppercase 将指定的字符串转换成大写 格式:angular.uppercase(string); string:被转换成大写的字符串. 使用代码: var str = "ABCabc"; var upperCase = angular.uppercase(str);//ABCABC angular.lowercase 将指定的字符串转换成小写 格式:ang

嘿!@野兽,你的ng api 掉了 - - angular.identity和angular.noop

@野兽的 ng api 学习 -- angular.identity和angular.noop angular.identity 函数返回本身的第一个参数.这个函数一般用于函数风格. 格式:angular.identity() 使用代码: <script> angular.module("Demo", []) .controller("testCtrl", ["$scope", function ($scope) { var getR

angular.js 的angular.copy 、 angular.extend 、 angular.merge

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script src="js/angular.min.js" type="text/javascript" charset="utf-8"></s

angular.equals()、angular.extend()、angular.foreach()、angular.fromJson()、angular.identity()等

angular.equals(o1, o2) 解释:参数o1和o2的比较(参数可以为变量.数组.对象) demo:angular.equals({name:'xxx'},{name:'yyy'}); //$ false angular.extend(dst, src) dst:被扩展的目标 src:扩展的对象 解释:对象的扩展,存在的类型进行值得覆盖,不存在的增加该类型. demo: var dst = {name: 'xxx', country: 'China'}; var src = {na

Angular JS - 6 - Angular JS 常用指令

1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <!-- 8 1. Angular指令 9 * Angular为HTML页面扩展的: 自定义标签属性或标签 10 * 与Angular的作用域对象(scope)交互,扩展页面的动

Angular Cli 升级到最新版本

1. 卸载当前版本 npm uninstall -g angular-cli 2. 清除未卸载干净的angular-cli缓存 npm cache clean -f 3. 到安装目录查看是否卸载干净 find /usr -name ng 4. 若未卸载干净(第三步有内容输出),则去到对应的目录删除:如若卸载干净(第三步未有内容输出),直接执行第五步: (1). 删除快捷方式 cd /usr/local/bin rm -f ng (2). 删除快捷方式指向的安装目录 cd /usr/local/l

简话Angular 03 Angular内置表达式大全

一句话: 大多数html标签属性和事件都有一个对应的ng指令 说明:这些指令和原生html最大的区别就是可以动态更新.比如一个div的样式用ng-class后,我们就可以随意应用css class. 1. 内置指令大全 ng-include 包含一个文件 ng-href ng-src 对应 href src ng-disabled ng-readonly 对应 disabled readonly ng-checked ng-selected ng-options ng-true-value ng