0. Angular经验总结

• 设计和理解工程的关键
  • 模块层次组织、路由
  • 父子模块之间的数据传递、事件传递
• 开发模式
  • 数据绑定。
    • ts代码文件中的模型类或者变量，可以绑定到html中的各个位置，如标签的属性上、标签中等处。
    • ngModel可以实现双向绑定
    • 如果HTML中需要根据状态改变显示，那么通常绑定到ts中的一个标志变量，最好不要绑定到有返回值的函数，避免框架要一直去执行函数，因为框架不知道计算结果什么时候到底变了没。
  • 事件绑定
    • ts代码文件中的public的方法，可以作为回调函数绑定到html中标签的事件上。
  • 一般并不会ts代码直接操作HTML中的DOM元素结构，都是通过数据进行绑定的。但ts代码中可以通过多种方式拿到DOM元素（或第三方组件），然后获取或操作其属性、触发其方法等。
  • 组件间数据、消息传递
    • 自己的不同层级的多个组件之间通常通过事件进行消息传递。
    • 或通过公共的service来进行传递（可以是Observable多播）。
    • 或通过@Input、@Output等传递数据、事件等。
  • 父组件通过事件控制子组件的刷新时，父组件要注意触发时机和次数，子组件要注意ngInit中一般在直接初始化和监听父组件事件初始化中二选一即可。
    • 如果父子组件间通过事件触发子组件的数据刷新，那么子组件在ngInit中订阅事件后，就不要在订阅之外再有初始化操作了，避免初始化两次。
    • 父组件在订阅ActivatedRoute.route.params时，一定要通过事件触发子组件的初始化，避免父组件在通过路由刷新界面时（而不是F5或用刷新按钮刷新界面），子组件没有更新。
    • 如果父组件中有多个地方可以触发子组件的刷新，那么要注意触发时机的逻辑合理性，同时要避免第一次初始化时触发多次（比如这些地方判断下是不是第一次加载）。