使用命名行創建一個Angular Component：

ng generate component messages

創建一個message service：

ng generate service message

message service的實現：其實就是內部維護了一個字符串數組，存儲其他Component添加的message：

通過構造函數參數注入的方式將message service注入到hero service中：

在hero Service里消費message Service：

需要在message Component里顯示message Service內部維護的字符串數組：

注意，此處11行的messageService必須定義成public，因為需要在Component view的html里使用它。

The messageService property must be public because you’re going to bind to it in the template.

Angular only binds to public component properties.

message Component的實現：

<div *ngIf="messageService.messages.length"><h2>Messages</h2><button class="clear"(click)="messageService.clear()">clear</button><div *ngFor='let message of messageService.messages'> {{message}} </div></div>

最后的效果：

要獲取更多Jerry的原創文章，請關注公眾號"汪子熙":

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的Angular里的消息(Message)显示的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。