再次讨论Angular2中的全局数据

Question

如果我的angular2应用程序看起来像这样,并且顶部的金发女郎将在右中间与姜谈话,他们应该组织一个派对吗？

发出事件,使用输入输出 - 这是angular2方式？数据应该从子节点传递到父节点到根节点,然后从父节点传递到子节点到点？我是新来的,我经常想要一些全局对象,我可以保留一些所有组件都需要知道的信息.当数据在该全局对象中发生变化时,它应该在它注入的所有其他服务和组件中神奇地改变.例如用户登录/注销,或者如果他点击按钮等等.

import {Injectable} from 'angular2/core';

@Injectable()
export object Globals {
    logged: false,
    showThatDiv: true
}

但我在某处读到它是Angular1,而不是Angular2方式.这样对吗？或者我错了？它看起来不像全球汤,只是全球国家的对象.

例如,现在我有这样的结构:

|-root
  |-google api component
    |-google auth
    |-youtube api
      |-playlists
      |-video
  |-myComponent
    |-sub1
      |-sub2
        |-sub3
  |...

mySub1组件需要知道用户是否已记录,如果是,则显示(*ngIf)sub2中的某个div.或者从mySub3组件调用googleAuth服务中的checkGauth().从mySub2组件添加视频到YouTube播放列表和onAdded在sub2中显示结果,或从sub3创建新播放列表并在sub2上显示.很多变种.

我厌倦了为所有这些编写代码.它使它更复杂.有时候想着这样做:

 |-root
   |-google api component
   |-google auth
   |-youtube api
   |-playlists
   |-video
   |-myComponent
   |-sub1
   |-sub2
   |-sub3
   |...

Answer 1

为每个API 构建服务是将组件隔离在一起的好方法.在您的情况下,您需要构建一个GoogleService,它可以保存您运行应用程序当前状态的上下文.服务可以在您需要的时间和地点进行注入.

话虽如此,我们可以在某些情况下绘制细线.在那些情况下,

1. 消息传递,通过您的组件传递数据,在您的情况下,如果您的父母知道登录并且孩子想知道登录,传递它并且绑定将保持更新,以便您可以在您的子组件上可靠地使用它.

2. 创建一个帮助程序,它封装了与您的功能相关的所有功能.使用旧时尚导入引用它并在组件上使用它.

发出事件,使用输入输出 - 这是angular2方式？

是的,这是了解组件需要和组件排放的最佳方式.但这并不难,双向数据绑定让您以最小的努力工作.

数据应该从子节点传递到父节点到根节点,然后从父节点传递到子节点到点？

让孩子通过输入从Parent获取数据并返回输出作为回调,Checkout this Blog以查看它是如何在真实世界的应用程序上完成的.

希望有助于您入门.欢迎来到Angular 2,你会喜欢它!