安装Node

先去Node官网下载并安装Node.js

Install the Angular CLI(安装Angular CLI)

npm install -g @angular/cli

Create a new application(创建新项目)

ng new your-application-name

Serve the application(启动项目)

ng serve

Create the component(创建component)

ng generate component your-component-name

如果不想要.html文件,采用模板内嵌的方式,使用下列指令

ng generate component your-component-name -it

Create the service(创建Service)

ng generate service your-service-name

有几种方式注入服务,在对应的Component中,在AppComponent中,在AppModule中。每个选项都有优点和缺点。
在AppModule中注入服务,通过追加--module = app来完成。

ng generate service your-service-name --module=app

在生成的时候没有指定方法,也可以手动注入服务。

Creating a class(创建Class)

ng generate class your-class-name

Add the AppRoutingModule(添加路由)

ng generate module app-routing --flat --module=app

--flat将文件放在src / app中而不是它自己的文件夹中。
--module = app告诉CLI将其注册到AppModule的imports数组中。

Install package from npm(安装npm包)

Install the In-memory Web API package from npm

npm install angular-in-memory-web-api --save

发布

ng build --prod

--prod表示压缩

参考资料 Angular CLI

https://github.com/angular/angular-cli/wiki/stories
https://cli.angular.io/
https://angular.cn/guide/cheatsheet
https://segmentfault.com/a/1190000009771946

Angular常用指令的更多相关文章

  1. Angular JS从入门基础 mvc三层架构 常用指令

    Angular JS从入门基础  mvc模型 常用指令 ★ 最近一直在复习AngularJS,它是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核心 ...

  2. angular与angularjs常用指令的不同写法整理

    angularjs与angular 常用的指令写法的区别; 一:angularjs指令 1.ng-bind 使用给定的变量或表达式的值来替换 HTML 元素的内容 <p ng-bind=&quo ...

  3. Angular JS - 7 - Angular JS 常用指令2

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. Angular JS - 6 - Angular JS 常用指令

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. 走进AngularJs(二) ng模板中常用指令的使用方式

    通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板 ...

  6. vue.js介绍,常用指令,事件,以及制作简易留言版

    一.vue是什么? 一个mvvm框架(库).和angular类似,比较容易上手.小巧,让我们的代码更加专注于业务逻辑,而不是去关注DOM操作 二.vue和angular之间的区别 vue--简单易学 ...

  7. angular之指令

    指令(Directive) 1.指令概念介绍 --  AngularJS有一套完整的.可扩展的.用来帮助web应用开发的指令集. --  在DOM编译期间和HTML关联着的指令会被检测到,并且 会被执 ...

  8. 1.Vue.js的常用指令

      Vue.js介绍 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得 ...

  9. angular 常用写法

    1.ng-repeat 数组数据中,不允许数组中有相同的两个数据,这个时候用下标去管理数据便可以解决这个问题 ng-repeat="item in list track by $index& ...

随机推荐

  1. js进阶正则表达式6转义字符(加\转义)(.符号)(|符号)

    js进阶正则表达式6转义字符(加\转义)(.符号)(|符号) 一.总结 转义字符:{} () / $ # & * . ....... //3.特殊字符,都要加转义\ 点符号:var reg2= ...

  2. vimrum

    # Insert your preferred key mappings here.unmap <a-O>map <a-O> closeOtherTabsmap , previ ...

  3. php实现求一个数的质数因子

    php实现求一个数的质数因子 一.总结 一句话总结:这么简单的题目,还是把变量定义的位置和自增的位置写错. 1 <?php 2 $num=trim(fgets(STDIN)); 3 //如果$n ...

  4. 简单实现的Servlet文件上传,并显示

    http://my.oschina.net/Barudisshu/blog/157481

  5. Golang快速入门

    Go语言简介: Golang 简称 Go,是一个开源的编程语言,Go是从2007年末由 Robert Griesemer, Rob Pike, Ken Thompson主持开发,后来还加入了Ian L ...

  6. EL表达式JSON应用

    由于之前在学校写的jsp页面都是夹杂着java代码的,所以之前写了个jsp,满满的<%%>和java代码,老师说那样太不美观了啊!!!要全部用EL表达式替代了.本人还是太笨了,弄了一上午才 ...

  7. CocoaPods详解之(三)----制作篇

    CocoaPods详解之----制作篇 作者:wangzz 原文地址:http://blog.csdn.net/wzzvictory/article/details/20067595 转载请注明出处 ...

  8. HDU 1224 Free DIY Tour - 最短路

    传送门 题目大意: 一个有向图(n + 1相当于1),每个点有一个权值(可以认为1和n+1权值为0),求从1走到n+1(相当于走回1)的最大路径权值和是多少,输出方案. 题目分析: 最短路问题,输出方 ...

  9. Windows安装Jekyll

    Run Jekyll on Windows 夹 Jekyll介绍 安装Ruby 安装DevKit 安装Jekyll 安装Python 安装pip 执行Jekyll Introduction Jekyl ...

  10. 【25.00%】【vijos P1907】飞扬的小鸟

    描述 Flappy Bird 是一款风靡一时的休闲手机游戏.玩家需要不断控制点击手机屏幕的频率来调节小鸟的飞行高度,让小鸟顺利通过画面右方的管道缝隙.如果小鸟一不小心撞到了水管或者掉在地上的话,便宣告 ...