学海无涯苦作舟

这篇博客感觉写得很好，所以转载过来了记录一下，格式都没有要看的话，直接到原地址看吧： 利用npm安装/删除/发布/更新/撤销发布包目录什么是npm? 利用npm安装包 npm安装的方式——本地安装和全局安装 利用npm删除包 删除全局模块 删除本地模块 利用npm 发布包 第一次发布包： 非第一次发布包： 利用npm撤销发布包 npm更新发布后的包：正文回到顶部 什么是npm

在6.3节中使用ng-content投影过去的复杂组件，我们需要使用代码操作它该怎么做呢？使用@ContentChild装饰器可以获取到被投影的组件的实例首先父组件中使用子组件，并投影另一个组件： 然后再子组件中通过ng-content，使用select设置一个占位，以备投影：在投影进去的组件中导入ContentChild等必要模块。然后使用@ContentChild()装饰器，声明一个需要使用的

内容： - 最基本的ng-content的用法 - 用projection slotstou应多块内容 - 把自定义组件投影进去 - 事件的处理方式最基本的ng-content的用法一个最简单的嵌套结构，app.component.html中有一个父组件，然后父组件内部还有一个子组件。加入子组件中的东西可能不是那么简单，比如标题并不是写死的，也不是绑定在子组件的某个属性中的

Angular封装HTML模板和CSS的三种方式： - ShadowDom模式：使用浏览器原生方式渲染组件，但是不同浏览器的原生渲染方式是不一样的，存在浏览器之间的兼容问题 - emulated模式：即模拟模式，Angular默认的组件渲染方式，通过js模拟浏览器的原生渲染方式（即模拟ShadowDom模式），这个是为了完善在不同浏览器上的兼容性问题，性能当然是比不上浏览器原生渲染的，所

正常在父组件中使用子组件的方法是如下： 父组件html模板代码中：<!--前面的内容-->...<child-component></child-component><!--这里直接插入子组件标签，然后标签里面的内容都是固定的-->...<!--后面的内容-->但是如果我们不想这样固定地插入子组件，而是想通过代码动态地创建该如何进行呢？下面就介绍用代码动态创建组件： 直接看代码： 首先

动效概述Angular动效遵守的规范：https//w3c.github.io/web-animations/ (这个是w3c的规范，目前还是处于草案状态，可以看出Angular还是走在听前面的，哈哈)浏览器的支持情况：http://caniuse.com/#search=web-animation,从这边看到目前浏览器对web-animation的支持情况还是很差的，只有chrome和fire

如果打算自己写组件库的话，组件的声明周期需要深入掌握。寻常的业务代码倒不会太涉及这方面的东西。 组件生命周期的这些钩子的执行顺序 如下图所示： 实现的ngOnChanges(){}钩子方法会在组件的最先运行，比ngOnInit()都更前。这和angular组件本身的实例化是有关系的。angular在实例化组件时是会先去处理那些输入属性（也就是@Input属性）的。所以会先调用ngOnChan

父子组件之间的通讯父子组件使用后显示如下图所示： 随后代码结构，父子组件之间的代码层次如图所示：父组件接收子组件的事件，在子组件中使用@Output输出事件 通过下方代码注释中的1,2,3,4,5点注释，完成子组件按钮点击到父组件得到方法响应的过程。是一个子层向父层传递事件的过程。这就是父组件需要响应子组件的事件，或者接收数据，可以使用@Output输入一个事件，将数据通过event传递，作为

这系列文章都是通过大漠孤烟的视频教程整理而来，挂个翻译标签不会被说什么侵权吧！Angular 2环境搭建安装node见下方nodejs&&npm安装安装完成node之后，就会自然有npm包管理器，但是我们搭建Angular 2的开发环境需要安装@angular/cli，这个东西依赖的包有些事会被墙的，所以我们需要使用国内的镜像。所以推荐使用cnpm安装angular/cli。所以我们需要先安装cn

在使用angular/cli创建的新项目中，先将css的预编译器改为scss（将所有已.css为后缀的文件都改为.scss为后缀；同时将其他文件中对css文件的引用也都改为.scss）。随后导入bootstrap和font-awesome的依赖包（在package.json中添加这两个依赖包，然后运行cnpm install命令即可）。随后可以做对应的语法测试。插值语法也就是典型的{{}}获取值的方

新项目搭建ng new命令新建项目首先到工作目录底下，然后使用ng new命令初始化一个新项目：ng new newProject // 后面跟的是项目名称命令执行结果如下： 这个命令会自动帮我们生成所需要的一些基本文件，注意上图，在create完成一些命令之后，它还会自动调用npm install命令，使用npm把对应的依赖包下载下来。这个时候请使用ctrl+C，进

这系列文章都是通过大漠孤烟的视频教程整理而来，挂个翻译标签不会被说什么侵权吧！一、集成开发环境@angular/cli开发angular项目时需要哪些node模块呢？@angular/cli： - webpack - TS - Karma 单元测试 - Jasmine 单元测试 - protractor 量角器，集成测试，端到端测试 - Material Design自

1、Component中的.html文件中item添加点击事件：<a class="home-menu-item" *ngFor="let item of menuItems" (click)="gotoPage(item)"> <img class="" src="{{item.imgSrc}}"> <span>{{item.subTitle}}</span> </a>2、 C

内容提要 - 组件与指令之间的关系 - Angular中内置的指令（共37个） - 指令的作用（属性型和结构型） - 自定义属性型指令（@HostListener与@HostBinding） - 自定义结构性指令（非常复杂，一般在业务处理中用得很少，一般是会用在封装组件库中！） 指令相关的官方文档：https://angular.cn/guide/attrib