無法將角度4中的父數據傳遞給子組件

Question

當我嘗試將數據從父項傳遞給子組件時，出現錯誤。

這是我把它放在父組件中的標籤。

<pop-up [showPopUp]="true" [content]="content" [title]="title goes here"></pop-up> 

子組件

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


@Component({ 
    selector: 'pop-up', 
    templateUrl: './pop-up.component.html', 
    styleUrls: ['./pop-up.component.css'] 
}) 
export class PopUpComponent implements OnInit { 
    @Input() 
    showPopUp: boolean; 
    @Input() 
    title: string = ""; 
    @Input() 
    content: string = ""; 

    constructor() { 
    } 
    ngOnInit() { 
    debugger; 
    } 
    proceed() { 
    this.showPopUp = true; 
    } 
    closePopUp() { 
    this.showPopUp = false; 
    } 
} 

我想使用的變量showPopUp，標題和內容中的HTML這樣

<h5 class="modal-title" id="exampleModalLabel">{{title}}</h5> 
<h5 class="modal-title" id="exampleModalLabel">{{content}}</h5> 

但是當我嘗試使用它，我獲取錯誤

我不知道我到底做錯了什麼。

Answer 1

[title]="title goes here" 

應該

[title]="'title goes here'" 

或

title="title goes here" 

你原來的代碼試圖將表達式的值賦給title goes here到title，但就是沒有有效的表達。 您可以使表達式成爲字符串文字，或刪除[]，然後Angular不會嘗試將該值解釋爲表達式。