使用服务

时间:2017-02-22 12:24:42

标签: angular

我创建了一个包含2个组件和服务的简单应用程序,通过让一个组件更新另一个组件订阅的服务中的值来显示如何将项目添加到购物篮。使用this Plunker示例,您可以看到服务获取更新的值,但是当您单击购物篮的值时,您将看到组件中购物篮中的商品数量保持为0(使用console.log)。如何使组件与服务的值相匹配?

我认为这可能是因为我的主页面是这样的,所以它将组件视为单独的应用程序,因此创建了2个服务。我不希望在一个根应用程序中拥有所有角度组件。

   <body>
    <div>
      Basket Holder<fc-basket>loading basket...</fc-basket><br/><br/>
    </div>
    <my-app>
    loading...
  </my-app>
  </body>`

1 个答案:

答案 0 :(得分:2)

问题是你提供了3次basketService,并且有3个篮子服务实例和他们自己的订阅流程。

    在app.module 定义时,在应用模块级别
  • 在单个组件级别

如果您已在模块中执行此操作,则不需要provides[service]。否则它将创建另一个实例,而不是使用模块级实例

我在resolved plunker

解决了你的傻瓜问题