shared-service.ts

import { Observable } from 'rxjs/Observable';
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
@Injectable()
export class SharedService {
// Observable string sources
private emitChangeSource = new Subject<any>();
// Observable string streams
changeEmitted$ = this.emitChangeSource.asObservable();
// Service message commands
emitChange(change: any) {
this.emitChangeSource.next(change);
}
}

Now inject the instance of the above service in the constructor of both the parent and child component.

The child component will be emitting a change every time the onClick() method is called

child.component.ts

import { Component} from '@angular/core';
@Component({
templateUrl: 'child.html',
styleUrls: ['child.scss']
})
export class ChildComponent {
constructor(
private _sharedService: SharedService
) { } onClick(){
this._sharedService.emitChange('Data from child'); }
}

The parent component shall receive that change. To do so,capture the subscription inside the parent's constructor.

parent.component.ts

import { Component} from '@angular/core';
@Component({
templateUrl: 'parent.html',
styleUrls: ['parent.scss']
})
export class ParentComponent {
constructor(
private _sharedService: SharedService
) {
_sharedService.changeEmitted$.subscribe(
text => {
console.log(text);
});
} }

Hope this helps :)

import { Subject } from 'rxjs/Subject';的更多相关文章

  1. RxJS - Subject(转)

    Observer Pattern 观察者模式定义 观察者模式又叫发布订阅模式(Publish/Subscribe),它定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象,这个主题对象的状态 ...

  2. [RxJS] Subject basic

    A Subject is a type that implements both Observer and Observable types. As an Observer, it can subsc ...

  3. [RxJS] Subject: an Observable and Observer hybrid

    This lesson teaches you how a Subject is simply a hybrid of Observable and Observer which can act as ...

  4. [RxJS] Subject asObservable() method

    You can create your own state store, not using any state management libraray. You might have seen th ...

  5. rxjs——subject和Observable的区别

    原创文章,转载请注明出处 理解 observable的每个订阅者之间,是独立的,完整的享受observable流动下来的数据的. subject的订阅者之间,是共享一个留下来的数据的 举例 这里的cl ...

  6. RxJS之Subject主题 ( Angular环境 )

    一 Subject主题 Subject是Observable的子类.- Subject是多播的,允许将值多播给多个观察者.普通的 Observable 是单播的. 在 Subject 的内部,subs ...

  7. angular2 学习笔记 ( rxjs 流 )

    RxJS 博大精深,看了好几篇文章都没有明白. 范围牵扯到了函数响应式开发去了... 我对函数式一知半解, 响应式更是第一次听到... 唉...不过日子还是得过...混着过先呗 我目前所理解的很浅,  ...

  8. [Angular 2] Managing State in RxJS with StartWith and Scan

    The scan operator in RxJS is the main key to managing values and states in your stream. Scan behaves ...

  9. RxJS速成 (下)

    上一部分: http://www.cnblogs.com/cgzl/p/8641738.html Subject Subject比较特殊, 它即是Observable又是Observer. 作为Obs ...

随机推荐

  1. GNU C内联汇编(AT&amp;T语法)

    转:http://www.linuxso.com/linuxbiancheng/40050.html 内联汇编提供了可以在C或C++代码中创建汇编语言代码,不必连接额外的库或程序.这种方法对最终程序在 ...

  2. 通过pl/sql计算程序的运行时间

    在sqlplus中运行sql语句或者pl/sql的时候如果需要统计运行的时间,只需要开启set timing on选项即可. SQL> set timing onSQL>SQL> s ...

  3. app生成工具

    国内主流的在线APP生成工具 应用公园:http://www.apppark.cn/ 追信魔盒:http://app.zhui.cn/ 安米网:http://www.appbyme.com/ 简网AP ...

  4. Cronz表达式

  5. 突破,Objective-C开发速学手册

    <突破,Objective-C开发速学手册> 基本信息 作者: 傅志辉 出版社:电子工业出版社 ISBN:9787121207426 上架时间:2013-7-12 出版日期:2013 年8 ...

  6. select标签中option内容加链接

    1.Html页面代码 <select name="select" id="select" style="height: 25px; width: ...

  7. springCloud微服务使用

    一.微服务简介 1.演变过程:单体架构.SOA.微服务 2.单体架构:一个应用包含了应用之间所有的功能程序,通过打成war包的方式发布部署. 缺点:复杂性逐渐偏高.技术债务逐渐变慢.阻碍技术的创新扩展 ...

  8. socket连接和http连接的区别

    socket连接和http连接的区别 HTTP协议:简单对象访问协议,对应于应用层  ,HTTP协议是基于TCP连接的 tcp协议:    对应于传输层 ip协议:     对应于网络层 TCP/IP ...

  9. asp.net core 系列之允许跨越访问(Enable Cross-Origin Requests:CORS)

    这篇文章介绍如何允许跨域访问 浏览器安全不允许不同域名的网页之间发送请求.这种限制叫做同源策略(the same-origin policy). 同源策略可以防止一个恶意的站点读取另一个站点的敏感数据 ...

  10. jstl标签不起作用不管用,jstl标签直接输出表达式

    jstl标签不起作用不管用,jstl标签直接输出表达式 解决办法: 在jsp页面头上 引入: <%@ page isELIgnored="false"%> 便能够解决.