2017-04-21 67 views
0

我怎樣才能連續獲得一天?例如,我有這樣的HTML:連續獲取日期,今天和明天

<ul> 
<li (click)="prevDay()"></li> 
</ul> 

<div>{{day}}</div> 

JS:

dayBefore() { 
     let now: any = new Date(); 
     this.days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday']; 
     this.day = this.days[now.getDay() - 1]; 
} 

這樣,我昨天只得到,但我需要它不斷。當我再次點擊<div>{{day}}</div>我需要它去'昨天'前一天等等。所以,週四,週三,週二等。

編輯:今天和明天一樣...

+0

跟蹤遞減的一個變量? – VirtualTroll

+0

是的......確切地說。 –

+0

請參閱我的最終編輯。 –

回答

1

你可以嘗試以下方法:

<script src="https://code.angularjs.org/2.0.0-alpha.26/angular2.sfx.dev.js"></script> 

<script> 
    function AppComponent() { 
      this.day = ''; 
     this.decrement = 0; 
     this.days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday']; 
     this.dayBefore = function() { 

        var now = new Date(); 
      this.decrement+=1; 
      var newDate = this.decrementDays(now, this.decrement); 
      this.day = this.days[newDate.getDay()];    
     }, 
     this.decrementDays = function addDays(date, days) { 
      return new Date(
     date.getFullYear(), 
     date.getMonth(), 
     date.getDate() - days, 
     date.getHours(), 
     date.getMinutes(), 
     date.getSeconds(), 
     date.getMilliseconds() 
     ); 
     } 

    } 

    AppComponent.annotations = [ 
     new angular.ComponentAnnotation({ 
     selector: 'my-app' 
     }), 
     new angular.ViewAnnotation({ 
     template: '<ul>' + 
'<li (click)="dayBefore()">aaaaa</li>' + 
'</ul>' + 
'<div>{{day}}</div>', 
     directives: [angular.NgFor] 
     }) 
    ]; 

    document.addEventListener('DOMContentLoaded', function() { 
     angular.bootstrap(AppComponent); 
    }); 

</script> 

<my-app></my-app> 
+0

它說'減少量不存在於類型窗口' –

+0

這個怎麼樣? – VirtualTroll

+0

這是爲angular2,它必須是類型匹配..它說'減少不存在組件' –

1

在你的控制器,初始化只有一次的日子陣列

private myDate=new Date(); 
private days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday']; 
private day = this.days[this.myDate.getDay()];; 

所以,你有你的今天日期的新日期。然後在更改日期的方法中更新日期。

private dayBefore(){ 
    this.myDate=this.myDate.addDays(-1); 
    this.day= this.days[this.myDate.getDay()]; 
} 

private dayAfter(){ 
    this.myDate=this.myDate.addDays(1); 
    this.day= this.days[this.myDate.getDay()]; 
} 

private restoreToday(){   
    this.myDate=new Date(); 
    this.day= this.days[this.myDate.getDay()]; 
} 

而且,在你的HTML

<ul> 
    <li (click)="dayBefore()">Prev</li> 
    <li (click)="restoreToday()">Today</li> 
    <li (click)="dayAfter()">Next</li> 
</ul> 

<div>{{day}}</div> 
1

您應該按以下使用,

currentPos=5; 
    today : string= 'Friday' 
    days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday']; 

    constructor() { 
    this.today=this.days[this.currentPos]; 
    } 
    prev(){ 
    //this.daysArray.push(this.days[this.currentPos]); 
    if(this.currentPos>0){ 
     this.currentPos--; 
     this.today=this.days[this.currentPos]; 

    } 
    else if(this.currentPos==0){ 
     this.today=this.days[0] 
     this.currentPos=6; 
    } 


    } 
} 

LIVE DEMO