Açısal 2 Bileşen özel özniteliği yapıcıda sıfırdır

Question

Bir bileşen oluşturuyorum ve üzerinde özel bir öznitelik göndermeye çalışıyorum. Ama kurucuda sadece bir boş alırım. Değişkeni yazdırdığımda bir şey olduğunu biliyorum.

this is how I know voteDate has something{{voteDate}} 

<countdown [attr.inputDate]="voteDate"></countdown> 

ve bu bileşen (ı yapıcı bir null olsun) 'dir:

import {Component, OnInit, ElementRef} from 'angular2/core'; 
import {Observable} from 'rxjs/Rx'; 

@Component({ 
    selector: 'countdown', 
    template: ` 
    <div class="font-poll-countdown"> 
    Poll Will Close in: {{message}} 
    </div> 
` 
}) 
export class CountDown implements OnInit { 

    private future: Date; 
    private futureString: string; 
    private diff: Date; 

    constructor(elm: ElementRef) { 
     this.futureString = elm.nativeElement.getAttribute('inputDate'); 
    } 

    dhms(t) { 
     var days, hours, minutes, seconds; 
     days = Math.floor(t/86400); 
     t -= days * 86400; 
     hours = Math.floor(t/3600) % 24; 
     t -= hours * 3600; 
     minutes = Math.floor(t/60) % 60; 
     t -= minutes * 60; 
     seconds = t % 60; 

     return [ 
      days + 'd', 
      hours + 'h', 
      minutes + 'm', 
      seconds + 's' 
     ].join(' '); 
    } 



    ngOnInit() { 
     this.future = new Date(this.futureString); 
     Observable.interval(1000).map((x) => { 
      this.diff = Math.floor((this.future.getTime() - new Date().getTime())/1000); 
     }).subscribe((x) => { 
      this.message = this.dhms(this.diff); 
     }); 
    } 
} 

bu

diğer bileşenden dediğimiz, ben geri sayım Bileşeni html

Her şeyi deniyorum ama hala denetleyicide boş alıyorum.

Answer 1

InputMetadata'u kullanarak, verileri özelliklerden geçirebilirsiniz. Angular, değişiklik tespiti sırasında otomatik olarak veriye bağlı özellikleri günceller ve countdown bileşenine iletir. [] ile

sarma inputDate Eğer mevcut olmayacaktır bir @Input

<countdown [inputDate]="voteDate"></countdown> 

//inside your component 
@Input() inputDate: Date; 

Answer 2

Sizin özellik olarak bir bileşeni içine bunu tanımlamanız gerekir bu değere erişmek için daha sonra & (malı olarak geçmek) yapıcı. Sen ngOnInit() yaşam döngüsü kanca denir kadar beklemek gerekir: bahsedilen

ngOnInit() { 
    console.log(this.elm.nativeElement.getAttribute('inputDate')) 
} 

, ben Pankaj cevabı @ gibi - yerine bağlayıcı özelliğini kullanın. Ardından, istediğiniz tarihi gerçek bir JavaScript Date nesnesi olarak iletebilirsiniz. Niteliklerle her zaman bir dize değeri alırsınız.