安装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. [Jenkins] Define a pipeline

    node{ stage 'checkout' git '[github_url]' def project_path="[project_path]" // everythin i ...

  2. Linux下 kprobe工具的使用

    此处转载: 一.Kprobe简单介绍 kprobe是一个动态地收集调试和性能信息的工具,它从Dprobe项目派生而来,是一种非破坏性工具,用户用它差点儿能够跟踪不论什么函数或被运行的指令以及一些异步事 ...

  3. [Ramda] Get Deeply Nested Properties Safely with Ramda's path and pathOr Functions

    In this lesson we'll see how Ramda's path and pathOr functions can be used to safely access a deeply ...

  4. JM-1 手机网站开发测试环境搭建

    JM-1 手机网站开发测试环境搭建 一.总结 一句话总结:WEB服务器环境可实现局域网内轻松访问.360wifi可以实现局域网. 二.微网站开发环境: 1.把微网站放到本机wamp环境下,用pc浏览器 ...

  5. 矩阵分解(matrix factorization)

    1. 基本概念 针对高维空间中的数据集,矩阵分解通过寻找到一组基及每一个数据点在该基向量下的表示,可对原始高维空间中的数据集进行压缩表示. 令 X=[x1,⋯,xm]∈Rm×n 为数据矩阵,矩阵分解的 ...

  6. TensorFlow 学习(十四)—— contrib

    1. tensorflow.contrib.layers tf.contrib.layers.xavier_initializer():一种经典的权值矩阵的初始化方式:

  7. javascript中隐藏显示的样式表属性

    display属性 隐藏不占据位置 visibility属性 隐藏占据位置 //使用display的样式属性 隐藏 显示 //隐藏后不占据文档流位置 function showAddForm(){ v ...

  8. CodeBlocks 配色方案设置

    最终效果(官方sublime修改版) 官方配色 codeblocks是一个功能很强大编程软件,我们在安装codeblocks后软件默认的是白底黑字界面,这种界面在长时间写代码时会对眼睛造成很大伤害,增 ...

  9. Swift语言实现代理传值

    需求:利用代理实现反响传值(下面样例採用点击第二个视图控制器中的button来改变第一个视图控制器中的Label的内容) 一.创建RootViewController import Foundatio ...

  10. linux的开机启动过程:

    简单视图 按下电源开关 开机自检(BIOS)弹笔记本logo的时候,检查cpu 硬盘 这些硬件问题 MBR引导 一般是通过硬盘启动系统 GRUB的菜单 黑底白字有个倒数计时 可以选择内核 yum命令可 ...