Angular2入门(一)
原先用vue.js写的项目,最近领导要求改用Angular,于是开始自学之路。网上搜索了众多资料,包括谷歌原版书籍,但是Angular自从17年开始分为AngularJs和Angular两个版本,相差巨大,并且Angular已从2.0更新到6.0,网上资料庞杂且年代久远,不得要领。
花费了大量寻找资料的时间之后,终于摸索到了正确路线,在此记录学习历程。
此处不会详细介绍Angular的细节,只提供快速创建能运行Angular项目的教程。
需要理解细节可以到以下链接下载相关书籍学习:
揭秘Angular2 : https://download.csdn.net/download/qq_36625806/10472981
迈向Angular2 : https://download.csdn.net/download/qq_36625806/10472982
1.配置开发环境
操作系统:win7
开发平台:node.js v8版本以上
Angular版本:6.0
node.js下载地址:https://nodejs.org/en/
安装完node之后,打开windows命令窗口,输入下面的命令确认安装成功:
-->> node -v
安装Angular命令行工具:Angular CLI :
-->> npm install -g @angular/cli
在命令行输入 ng -v 确认Angular CLI 安装成功。安装成功会有一个Logo展示。
2.创建Angular项目:
-->> ng new student (student 是项目名称)
3.如何启动Angular的项目?
进入student项目,在命令行输入以下命令:
-->> npm start
当命令执行完毕,打开浏览器,输入:
localhost:4200 即可!(如果你没有手工修改端口的话)
3.如何在已有的项目引入其它插件?
进入student项目,在命令行输入以下命令:
-->> npm install bootstrap --save
找到项目的根目录找到angular.json,如下图填写:
4.如何自动创建自己的组件?
这个问题需要你试一下手工创建组件的痛苦,然后你就知道自动创建组件有多爽了!
以下直接说自动创建组件的用法:
自动创建页面的导航栏:
最新文章
- MRC迁移ARC之__block
- Java 多线程下的单例模式
- 数值的三种表示--C语言
- redis 在32位系统安装以及使用
- JavaScript中Trim(),TrimStart(),TrimEnd()的实现
- GridView中某一列值的总和(web)
- cos实现文件上传--推荐
- Linux编译错误集
- Timus 1796. Amusement Park 聪明题
- SSIS DB目录设置 (Integration Services Catalogs)
- 浅谈MySQL 数据库性能优化
- Linux入门(10)——Ubuntu16.04使用pip3和pip安装numpy,scipy,matplotlib等第三方库
- Racket 模拟SICP的流(延时计算)
- 最近邻查找算法kd-tree
- python-while else
- C#_Lamada帮助类
- 项目报错 exception 'MongoConnectionException' with message 'Failed to connect to: 127.0.0.1:27017: Authentication failed on database 'www' with username 'www': auth failed' in
- CM (Cloudera Manager) 的安装,便于CDH的离线部署
- 子墨庖丁Android的ActionBar源代码分析 (一)实例化
- 为什么 Category 不能增加成员变量-nonfragile
热门文章
- zepto.js和jquery.js函数比较有什么优点?
- JavaScript if为true的情况
- 如何进行Web服务的性能测试
- HTC新机A9足以取代iPhone 你相信吗?
- c#或者C#.net中的“ToolTip”是“System.Windows.Forms.ToolTip”和“DevComponents.DotNetBar.ToolTip”之间的不明确的引用
- C++与引用2
- win10环境下VS2019配置NTL库
- 一文看懂js中的clientX,clientY,pageX,pageY,screenX,screenY
- Java基础--冒泡排序算法
- LinkedHashMap源码解读