在Angular 5中将模型从一个组件传递到另一个组件

问题

我正在为SPA使用角度5。我有2个成分的父级子级。我从Parent组件调用了一个API，并将该API的响应转换为Model。现在，我想将该模型传递给其他组件。我已经使用@Input来获取模型，但是它在视图中呈现，但是没有陷入组件中。当我通过console.log传递该模型时，它显示为未定义。

码

import {Component, Inject, OnInit} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialog} from "@angular/material";

import {SpecDetailsServ } from "../services/SpecDetailsServ";
import {SpecDetailsModel} from "../models/SpecDetailsModel";
import {Quote} from "../models/Quote";
import {ServiceDialogComp} from "./ServiceDialogComp";
import {QuoteDetailsDialogComp} from "./QuoteDetailsDialogComp";

@Component({
  selector: 'app-spec-details-comp',
  templateUrl: '../views/spec-details.html',
  styleUrls: ['../../assets/css/component.css']
})

export class SpecDetailsComp implements OnInit {
    customerId = 1;



    getSpecDetails: Array<SpecDetailsModel>;
    showLoader = true;
    getQuotes: Quote;

    constructor(private getspecdetails: SpecDetailsServ, private matdialog: MatDialog) {
        this.getspecdetails.getSpecDetails(1).subscribe(res => {
            var resNew:any = res;
            this.getSpecDetails = resNew.result;
            this.showLoader = false;
        })
    }

    ngOnInit() {}
}   

父视图

<app-quote-details [getSpecDetails]="getSpecDetails"></app-quote-details>

子组件

import {Component, Inject, OnInit, Input} from '@angular/core';
import {SpecDetailsComp} from "./SpecDetailsComp";
import {MAT_DIALOG_DATA, MatDialog} from "@angular/material";

@Component({
    selector: 'app-quote-details',
    templateUrl: '../views/quote-details.html',
    styleUrls: ['../../assets/css/component.css'],
})

export class QuoteDetailsDialogComp {

   //this is the model i wanna pass to other component with data init
    @Input() getSpecDetails: Array<SpecDetailsModel>;

    constructor() {
        console.log(this.message);
    }
}