1. 父組件調用子組件的時候傳入數據

<app-header [msg]="msg"></app-header>

2. 子組件引入 Input 模塊

import { Component, OnInit ,Input } from '@angular/core';

3. 子組件中 @Input 接收父組件傳過來的數據

export class HeaderComponent implements OnInit {@Input() msg:stringconstructor() { }ngOnInit() {} }

?

4. 子組件中使用父組件的數據

?

h2>這是頭部組件--{{msg}}</h2>

?

---

注意：不要在app跟組件里演示，會報錯

---

?

?

?

轉載于:https://www.cnblogs.com/loaderman/p/10899618.html

與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的angular中父组件给子组件传值-@input的全部內容，希望文章能夠幫你解決所遇到的問題。

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