安装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. HDU1575-Tr A(矩阵高速幂)

    题目链接 题意:A为一个方阵,则Tr A表示A的迹(就是主对角线上各项的和),现要求Tr(A^k)%9973. 思路:简单的矩阵高速幂 代码: #include <iostream> #i ...

  2. inflate, findViewById与setContentView的区别与联系 分类: H1_ANDROID 2014-04-18 22:54 1119人阅读 评论(0) 收藏

    protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentV ...

  3. POI操作Excel常用方法总结 分类: B1_JAVA 2013-08-23 10:01 349人阅读 评论(0) 收藏

    转载自:http://blog.csdn.net/xjun15/article/details/5805429     一. POI简介               Apache POI是Apache ...

  4. 【u018】电车

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 在一个神奇的小镇上有着一个特别的电车网络,它由一些路口和轨道组成,每个路口都连接着若干个轨道,每个轨道 ...

  5. Android 设置图片透明度

    我了解的比较快捷的ImageView设置图片的透明度的方法有: setAlpha(); setImageAlpha(); getDrawable().setAlpha(). 其中setAlpha()已 ...

  6. 【hdu 5996】dingyeye loves stone

    Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Total Submission(s) ...

  7. [NPM] Run npm scripts when files change with onchange

    In this lesson we will look at how we can setup our npm scripts to execute when the file system has ...

  8. Color the ball(杭电1556)

    Color the ball Time Limit : 9000/3000ms (Java/Other)   Memory Limit : 32768/32768K (Java/Other) Tota ...

  9. Hive的日期函数

    1.unix时间戳转时间函数 语法: from_unixtime(bigint unixtime[, string format]) 返回值: string 说明: 转化UNIX时间戳(从1970-0 ...

  10. sklearn 特征降维利器 —— PCA & TSNE

    同为降维工具,二者的主要区别在于, 所在的包不同(也即机制和原理不同) from sklearn.decomposition import PCA from sklearn.manifold impo ...