Angular 2具有日期类型属性的@Input（）装饰器对象

Question

我有一个组件，它充当一个愚蠢的子组件，并通过它的父项中的@Input（）类型接受一个对象。

这个对象（人）具有属性/字段“DOB”，这是类型日期。

这里是父组件的构造函数获取从路线的决心的人，它随后将传递给子组件@input（）。

constructor(private route: ActivatedRoute, 
      private authService: AuthenticationService, 
      private personService: PersonService) { 

    this.route.data.subscribe(result => { 
    this.person = Object.assign({}, result['data'].person); 
    console.log('PERSON PARENT DATE: ' + this.person.dob); 

    }, 
    error => { 
    console.log('PersonOverviewComponent - Error getting resolve data: ' + error); 
    }); 
} 

这里是子组件：

export class MyDetailsOverviewComponent implements OnInit { 

    @Input() person: Person; 
    @Input() member: Member; 
    @Input() personIsMember: boolean; 

    constructor(private route: ActivatedRoute, private authService: AuthenticationService) { 

    } 

    ngOnInit() { 
    console.log('PERSON CHILD DATE: ' + this.person.dob); 
    } 

} 

和父模板结合@input（）

<div class="row"> 
     <div class="offset-sm-1 col-sm-5"> 
      <my-details-overview 
       [person]="person" 
       [member]="member" 
       [personIsMember]="personIsMember"> 
      </my-details-overview> 
     </div> 
    <div *ngIf="personIsOfficial" class="offset-sm-1 col-sm-4"> 
     <emergency-info-overview 
      [info]="emergencyInfo" 
      [person]="person" 
      [personOfAge]="personOfAge"> 
     </emergency-info-overview> 
    </div> 

这里是获取个人服务对象并指定从.Net web api返回的日期。

getPerson(id: string): Observable<Person> { 
    let params = new URLSearchParams(); 
    params.set('id', id); 
    return this.http.get(this.config.apiEndpoint + '/People/', {search: params}) 
     .map((r: Response) => { 
     let person = r.json() as Person; 
     person.dob = new Date(r.json().dob); 
     this.utilities.cleanApiResponseData(person); 
     return person; 
     }) 
     .catch(error => { 
     console.log('PersonService Error: ' + error); 
     return Observable.throw(error); 
     }); 
} 

输出到控制台，用于从父组件person.dob示出：

PERSON PARENT DATE：星期四二○一六年十二月一十五日00:00:00 GMT + 0000（GMT标准时间）

但是，输出到控制台从子组件person.dob显示：

人儿童日期：空

子对象本身在子对​​象中是有效的，但dob属性除外。这里是人@Input（）成员从孩子打印到控制台。

PERSON CHILD DATE: { 
    "rowId":6, 
    "aspNetUserId":"#########", 
    "email":"#####", 
    "title":"Mr", 
    "forename":"James", 
    "surname":"Brown", 
    "address1":"#####", 
    "address2":"", 
    "address3":"", 
    "address4":"", 
    "town":"BIGGLESWADE", 
    "county":"Bedfordshire", 
    "country":"USA", 
    "postCode":"#####", 
    "daytimePhone":"", 
    "eveningPhone":"", 
    "mobile":null, 
    "dob":null 
} 

我的问题是如何将它传递给孩子的@input（）人员什么时候我的日期type属性的副本人物对象吗？

我假设我由于Date属性是一个引用类型而失去了一些东西，但不能锻炼如何让这个工作。

在此先感谢。

Person对象模型如下供参考：

export class Person { 
    aspNetUserId: string; 
    email: string; 
    title: string; 
    forename: string; 
    surname: string; 
    address1: string; 
    address2: string; 
    address3: string; 
    address4: string; 
    town: string; 
    county: string; 
    country: string; 
    postCode: string; 
    daytimePhone: string; 
    eveningPhone: string; 
    mobile: string; 
    dob: Date; 
    updatedBy: string; 
    updatedOn: string; 
} 

Answer 1

我已经能够通过这样做来解决这个的子组件如下：

export class MyDetailsOverviewComponent implements OnInit { 

    private person: Person; 
    @Input() set personInput (person: Person) { 
    this.person = Object.assign({}, person); 
    this.person.dob = new Date(person.dob); 
    } 

    @Input() member: Member; 

    @Input() personIsMember: boolean; 


    constructor(private route: ActivatedRoute, private authService: AuthenticationService) { 

    } 


    ngOnInit() { 
    console.log('PERSON CHILD DATE: ' + this.person.dob); 
    } 

} 

请问这是正确的做法？