美文网首页
angular组件传参

angular组件传参

作者: luckyvip | 来源:发表于2020-06-17 11:27 被阅读0次

【子传父】

【父传子】

【非父子组件】
1、创建shared-service.ts 文件

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);
    }
}

2、创建a.ts 文件

import { Component} from '@angular/core';
@Component({
   
})
export class AComponent {
    constructor(
        private _sharedService: SharedService
    ) { }

onClick(){
  this._sharedService.emitChange('Data from A');

 }
}

3、创建b.ts 文件

import { Component} from '@angular/core';
@Component({
   
})
export class BComponent {
    constructor(
        private _sharedService: SharedService
    ) {
          _sharedService.changeEmitted$.subscribe(
        text => {
            console.log(text);
        });
      }
}

相关文章

网友评论

      本文标题:angular组件传参

      本文链接:https://www.haomeiwen.com/subject/uxgjxktx.html