input（）が動作していない

Question

私は他の義務のためにしばらく離れる必要があったので、私はAngularでいくつか再学習しています。 @Input()が動作している必要がありますが、何らかの理由でエラーではありません。

@Component({ 
    selector: 'app-loader', 
    templateUrl: './loader.component.html', 
    styleUrls: ['./loader.component.scss'] 
}) 
export class LoaderComponent implements OnInit { 

    @Input() isLoadings: boolean; 
    @Input() parentData = 'Data from parent'; 

    constructor() { } 

    ngOnInit() { } 

} 

子コンポーネント：

@Component({ 
    selector: 'app-home', 
    templateUrl: './home.component.html', 
    styleUrls: ['./home.component.scss'] 
}) 
export class HomeComponent implements OnInit { 

    quote: string; 
    isLoading: boolean; 
    name: string; 
    childMessage: string; 

HTML：

<app-loader [isLoadings]="isLoading" [parentData]="childMessage">{{childMessage}}</app-loader> 

以下の作品。

[isLoadings]="isLoading" 

しないのはなぜ：

[parentData]="childMessage" 

Answer 1

子：LoaderComponent

@Input() parentData:string; 

親：HomeComponent

childMessage ='Data from parent'; 

@Input子コンポーネントでは、親コンポーネントから 'メッセージ'を受け取る必要があります。 isLoadingの両方が動作するため、= false（ブール型のデフォルト値）、親と子の両方のプロパティにあなたを誤認させる可能性があります（ただし、そのまま使用できます）。

あなたの例をリファクタリング：親である

@Component({ 
    selector: 'app-loader', 
    templateUrl: './loader.component.html', 
    styleUrls: ['./loader.component.scss'] 
}) 
export class LoaderComponent implements OnInit { 

    @Input() isLoadings: boolean; 
    @Input() parentData = ''; 

    constructor() { } 

    ngOnInit() { } 

} 

@Component({ 
    selector: 'app-home', 
    templateUrl: './home.component.html', 
    styleUrls: ['./home.component.scss'] 
}) 

export class HomeComponent implements OnInit { 
    quote: string; 
    isLoading: boolean; 
    name: string; 
    childMessage ='Data from parent'; 

.....