Angular4學習筆記（十） 元件間通訊

**如下：

message.service.ts

import  from '@angular/core';

import from 'rxjs/';
@injectable()
export class messageservice 
private subject = new subject();
sendmessage(something: any) 
clearmessage() 
getmessage(): observable
}

home.component.ts

import  from '@angular/core';

import from '../message.service';
@component()
export class homecomponent implements oninit 
ngoninit() 
sendmessage(): void 
clearmessage(): void 
}

import  from '@angular/core';

import from './message.service';
import from 'rxjs/subscription';
@component()
message: any;
subscription: subscription;
constructor(private messageservice: messageservice) 
ngoninit(): void );
} ngondestroy() 
}

非父子元件見通訊可以通過同乙個service來實現。需要注意的是一定要在service中定義乙個臨時變數來供傳遞。比如我有兩個元件來傳遞乙個book型別的資料，homecomponent->bookcomponent，book和service定義如下：

import  from '@angular/core';

import from 'rxjs/subject';
export class book 
@injectable()
export class bookservice ;
bookeventer: eventemitter= new eventemitter();
}

@component()

export class homecomponent implements oninit, ondestroy 
ngoninit() ;
} ngondestroy() 
}

import  from '@angular/core';

import from './book';
@component()
export class bookcomponent implements oninit );
} ngoninit() 
}

subscribebook：}

先訪問主頁再訪問書籍模板對應路由的話，顯示為:

rxjs - subject

angular 2 元件之間如何通訊？

angular2.0+ 模組之間共享service並訂閱更新

十 元件註冊

1.全域性元件註冊 1.template寫在div中通過template compnenta componenta div componenta this is component div template vue.component componenta methods newvue script...

Angular4學習筆記之管道

管道 pipes把資料作為輸入，然後轉換它，給出期望的輸出。每個應用開始的時候差不多都是一些簡單任務 獲取資料 轉換它們，然後把它們顯示給使用者。angular內建了一些管道，比如datepipe uppercasepipe lowercasepipe currencypipe和percentpip...

Angular4學習筆記 目錄彙總

angular4學習筆記 一 環境搭建 angular4學習筆記 二 在webstorm中啟動專案 angular4學習筆記 三 路由 angular4學習筆記 四 依賴注入 angular4學習筆記 五 資料繫結 響應式程式設計和管道 angular4學習筆記 六 input和output ang...