Angular核心:组件
Angular新特性:
Q1:命令行工具:AngularCLI
+ 生成新项目的骨架
+ 生成组件的基础代码
+ 作为一个开发服务器用来调试 编译 部署代码 运行单元化的自动测试
Q2:服务器端渲染:
+ 提高页面加载速率
+ 使一个单页应用针对每一个视图去做SEO (搜索引擎)优化,提高优化效率
Q3:移动和桌面兼容:
+ 框架
+ UI 组件
Angular架构
+ 整个应用就是一个组建树,
+ 用户看到的页面是这个组建树上几个被激活的组件所组成的,
+ 用户可以通过一些操作从一个组件路由到另一个组件,
+ 用户可以与某个组件进行交互,这种交互会由这个组件来负责处理,
+ 组件可以通过依赖注入的方式引入一些服务,并用这些服务来处理用户的操作或者与服务器进行通信
Angular基本概念
组件:Angular应用的基本构建块,可理解为一段带有业务逻辑和数据的Html || 一个具有特定功能的,可被反复使用的视图
+ Component
+ 组件必备元素:@Component() Template Controller
+ 组件元数据装饰器:@Component()
- 用来告知 Angular 框架如何处理一个TypeScript类
- Component 的多个属性的值叫做元数据,Angular 会根据这些元数据的值来渲染组件并执行组件的逻辑
服务:服务是指那些能够被其它的组件或者指令调用的单一的,可共享的代码块【用来封装可重用的业务逻辑 】 ; 组件可以调服务,服务也可以调用服务
指令:指令主要用来对模板的标签或者元素附加一些新的特性或者功能,改变一个 DOM 元素的外观或行为,Ag4指令和组件十分类似,也有由模块,注解,元数据以及组件类组成,实际上组件继承于指令,不同的是指令没有模板的信息,主要存在两种类型的指令:
结构型指令:会通过添加 / 删除 DOM 元素来更改 DOM 树布局
属性型指令:指令改变一个元素的外观或行为。
管道:本质是一个方法,用来实现对于数据的筛选 过滤 格式化
模块:将应用中不同的部分组织成一个Angular框架可以理解的单元
+Template
+ 通过组件自带的模版来定义组件的外观
+ 模版以Html的形式存在,告诉Angular如何来渲染组件
+ 可以在模版中使用Angular的数据绑定语法来呈现控制器中的数据
组件,服务,指令 是用来完成功能的
模块是用来打包和分发这些功能的
控制器:
+ Controller() { }
+ 控制器就是一个普通的TypeScript类
+ 会被装饰器装饰
+ 控制器包含组件所有的属性和方法
+ 控制器通过数据绑定与模板进行通信,模版展现控制器的数据,控制器处理模板上发生的事件
数据绑定:让模版的各个部分与控制器的各个部分相互作用的一个机制
+ 绑定方式:{{}} ,属性绑定 , 事件绑定 ,双向绑定
依赖注入:将我们需要用到的东西 注入 到当前的对象中去用,是通过提供器的设置来实现的
组件元数据装饰器:
+ 输入属性:@Inputs()
- 用于接受外部传入的数据
- 使得父组件可以直接传值给子组件
+ 提供器:providers
- 用来做依赖注入的
+ 样式表:styles
+ 动画:Animations
+ 输出属性:@Outputs
单例模式:在angular中 服务就是单例模式的类;单例模式指的在一个应用程序中,这个对象只保留单个实例。