如何根据 Ionic2 下拉菜单中显示的项目计算日期

Question

我是 Ionic 2 的初学者。我想根据混合 Ionic 应用程序中下拉菜单中显示的项目计算日期。

我的页面中有两个下拉菜单：

1. 第一个下拉列表

1. 第二个下拉菜单

我想，在过去 7 天选择并点击 **阻止按钮 ** 过去 7 天的日期将从当前日期计算，过去 1 个月和过去 12 个月相同，并将这些日子传递给我用于在饼图和条形图中显示数据的 url

这是我的 home.ts 代码

    import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { ChartPage } from '../chart/chart';
import moment from 'moment';
var s,p;

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  public states: any[];
  public districts: any[];
  public cities: any[];
  public selectedDistricts: any[];
  public selectedCities: any[];
  public sState: any;
  public sDistrict: any;

  appName = 'Dropdown App';

  constructor(public navController: NavController) { 
    this.initializeState();
    this.initializeDistrict();
    this.initializeCity();
  }

  initializeState(){
  this.states = [
    {id: 1, name: 'PieChart'},
    {id: 2, name: 'Line Chart'},
    {id: 3, name: 'Table'}
  ];
}

initializeDistrict(){
  this.districts = [
    {id: 1, name: 'Last 7 Days', state_id: 1, state_name: 'PieChart'},
    {id: 2, name: 'Last 1 Month', state_id: 1, state_name: 'PieChart'},
    {id: 3, name: 'Last 12 Months', state_id: 1, state_name: 'PieChart'},
    {id: 4, name: 'Custom Date', state_id: 1, state_name: 'PieChart'},

     {id: 5, name: 'Last 7 Days', state_id: 2, state_name: 'Line Chart'},
    {id: 6, name: 'Last 1 Month', state_id: 2, state_name: 'Line Chart'},
    {id: 7, name: 'Last 12 Months', state_id: 2, state_name: 'Line Chart'},
    {id: 8, name: 'Custom Date', state_id: 2, state_name: 'Line Chart'},


     {id: 9, name: 'Last 7 Days', state_id: 3, state_name: 'Table'},
    {id:10, name: 'Last 1 Month', state_id: 3, state_name: 'Table'},
    {id: 11, name: 'Last 12 Months', state_id:3, state_name: 'Table'},
    {id: 12, name: 'Custom Date', state_id: 3, state_name: 'Table'}

  ];
}
public openModal() {
      this.navController.push(ChartPage);
   }

    initializeCity(){
  this.cities = [

  ];
}
setDistrictValues(sState) {
     this.selectedDistricts = this.districts.filter(district => district.state_id == sState.id)
 }
setCityValues(sDistrict) {
      this.selectedCities = this.cities.filter(city => city.district_id == sDistrict.id);
 }

}

这是我的家.html

  <ion-header>
  <ion-navbar>
    <ion-title>{{ appName }}</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
<ion-item>
     <ion-label>Select Chart Type</ion-label>
     <ion-select (ionChange)="setDistrictValues(sState)" [(ngModel)]="sState">
          <ion-option [value]="sState" *ngFor = "let sState of states">{{sState.name}}  </ion-option> 
    </ion-select>

 </ion-item>
<ion-item *ngIf="selectedDistricts">
      <ion-label>Duration</ion-label>
      <ion-select (ionChange)="setCityValues(sDistrict)" [(ngModel)]="sDistrict">
            <ion-option [value]="sDistrict" *ngFor = "let sDistrict of selectedDistricts">{{sDistrict.name}}</ion-option>
      </ion-select>
 </ion-item>



<button ion-button block (click)="openModal()">Block Button</button>
</ion-content>

这是我的提供者

    import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class EarthquakesProvider {
  firstName: string;
    lastName: string;

  constructor(public http: Http) {

    console.log('Hello EarthquakesProvider Provider');
  }


   loadEarthquakesprovider() {
        return this.http.get(`http://factoryunlock.in/sundar/public/api/v1/production`)
            .map(res => res.json());
    }

}

我想在我的提供者中创建这种类型的网址

http://factoryunlock.in/sundar/public/api/v1/production?from=01/02/2017&to=01/05/2017

Answer 1

你好，你可以试试这样的

var days = 7;
var date = new Date();

//todays datetime  to milliseconds
var today = date.getTime();

//get 7 days in milliseconds

var daysinmilli = (days * 24 * 60 * 60 * 1000);

//make a new date for the 7th day
var res = date.setTime(today + daysinmilli );

date = new Date(res);


// pass your dates to the function below and get your date strings

function convertDate(date) {
  var yyyy = date.getFullYear().toString();
  var mm = (date.getMonth()+1).toString();
  var dd  = date.getDate().toString();

  var mmChars = mm.split('');
  var ddChars = dd.split('');

  return (ddChars[1]?dd:"0"+ddChars[0]) + '/' + (mmChars[1]?mm:"0"+mmChars[0]) + '/' + yyyy;
}

Answer 2

您可以简单地使用setDate() 和setMonth() 函数：

let date = new Date() //current date
date.setDate(date.getDate()+7);//After 7 days
date.setMonth(date.getMonth()+3);//After 3 months

查看更多关于Date object