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. 加速 Android Studio 的编译速度 2.2

    Android studio 2.2 当中有一项新的功能:Dex In Process. 这项功能可以动态的加快编译速度,以及提高Instant Run 的效率. 那么怎么来使用这项新功能呢?你只需要 ...

  2. 利用json2html将json数据填充到html模板

    1.下载json2html>> 2.制作好模板.准备好json数据.启动 <!DOCTYPE html> <html> <head> <meta ...

  3. fmri数据分析图像格式及转换问题——基于spm讨论

    1.几大常用格式 这张ppt介绍了现在常用的三种格式:dicom主要由扫描器产生,一般是一个slice一个文件:analyze 格式= .img/.hdr spm下用的最多:nifti ,由fsl & ...

  4. 重写alert方法完成类似gmail的友好提示

    当在网页中调用aelrt()方法的时候,系统会自动显示友好的提示方式 . 下面是css样式控制代码: /*----------------------------------------------- ...

  5. ylbtech-LanguageSamples-Libraries(库)

    ylbtech-Microsoft-CSharpSamples:ylbtech-LanguageSamples-Libraries(库) 1.A,示例(Sample) 返回顶部 “库”示例 本示例演示 ...

  6. Weblogic常见故障之二:XAER_NOTA XAException问题的解决

    在weblogic执行XA操作的时候,我们会碰到如下的错误,后来发现是JDBC配置的问题.主要报错:java.sql.SQLException: XA error: XAER_NOTA : The X ...

  7. android sdk下载SDK Platform失败记录

    在使用android sdk manager下载的时候会遇到 下载完毕后,你可能会出现如下图一样的错误,就算重复尝试多次依然无法正常安装 Downloading SDK Platform Androi ...

  8. decal in unity

    // Upgrade NOTE: commented out 'float4x4 _CameraToWorld', a built-in variable// Upgrade NOTE: replac ...

  9. win8.1 64位环境搭建android开发环境

    1.下载JDK,http://www.oracle.com/technetwork/java/javase/downloads/index.html,选择版本 2.安装刚刚下载的JDK 3.环境变量配 ...

  10. MVC工作原理

    MVC(Model-View-Controller,模型—视图—控制器模式)用于表示一种软件架构模式.它把软件系统分为三个基本部分:模型(Model),视图(View)和控制器(Controller) ...