发表于: 2017-06-26 20:28:41
1 1042
今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin)
优化后台数据,提升前台数据展示效果
明天计划的事情:(一定要写非常细致的内容)
了解 Angular 最新版本的最佳实践
遇到的问题:(遇到什么困难,怎么解决的)
什么是组件最佳实践?,应该可以明白如何组织他们?
收获:(通过今天的学习,学到了什么知识)
组件
组件实际上就是带有控制器的模板。他们既不是 指令,也不应该使用组件代替指令,除非你正在用控制器升级“模板指令”, 组件还包含数据事件的输入与输出,生命周期钩子和使用单向数据流以及从父组件上获取数据的事件对象。 从父组件获取数据备份。这些都是在AngularJS 1.5及以上推出的新标准。 我们创建的一切模板,控制器都可能是一个组件,它们可能是是有状态的,无状态或路由组件。 你可以把一个“部件”作为一个完整的一段代码,而不仅仅是.component()
定义的对象。 。
有状态的组件
什么是“有状态的组件”
- 获取状态,通过服务与后端API通信
- 不直接发生状态变化
- 渲染发生状态变化的子组件
- 作为一个组件容器的引用
无状态的组件
什么是无状态的组件
- 使用
bindings: {}
定义了输入和输出; - 数据通过属性绑定进入到组件内
- 数据通过事件离开组件
- 状态变化,会将数据进行备份 (比如触发点击和提交事件)
- 并不需要关心的数据来自哪里
- 可高度重复利用的组件
- 也被称作无声活着表面组件
指令
指令给予了我们的模板,scope ,与控制器绑定,链接和许多其他的事情。这些的使用使我们慎重考虑 .component()
的存在。指令不应在声明模板和控制器了,或者通过绑定接收数据。指令应该仅仅是为了装饰DOM使用。这样,就意味着扩展现有的HTML - 如果用.component()
创建。简而言之,如果你需要自定义DOM事件/ API和逻辑,使用一个指令并将其绑定到一个组件内的模板。如果你需要的足够的数量的 DOM变化,postLink
生命周期钩子值得考虑,但是这并不是迁移所有的的DOM操作。你可以给一个无需Angular的地方使用directive
使用指令的小建议:
- 不要使用模板 ,scope,控制器
- 一直设置
restrict: 'A'
- 在需要的地方使用
compile
andlink
- 记得
$scope.$on('$destroy', fn) 进行销毁和事件解除;
服务
服务本质上是包含业务逻辑的容器,组件不应该直接进行请求。服务包含其它内置或外部服务,如$http
,我们可以随时随地的在应用程序注入到组件控制器。我们在开发服务有两种方式,.service()
以及 .factory()
。使用ES2015Class
,我们应该只使用.service()
,通过$inject完成依赖注入。
评论