Как фильтровать данные json с датой datepicker Angular2 app

У меня есть приложение Angular 2, где я использую угловые2-highcharts. Я получаю данные от json для высоких графиков, но мне бы хотелось, чтобы фильтры, данные которых будут использоваться в диаграммах по дате начала и окончания. Может кто-нибудь помочь мне с этим вопросом или дать мне ссылку на учебник или что-то там, где я могу найти информацию об этом.Как фильтровать данные json с датой datepicker Angular2 app

Я использую mydaterangepicker и есть сервис для получения данных из JSON:

@Injectable() 
export class ValuesService { 

    http: Http; 
    constructor(http: Http) { 
     this.http = http; 
    } 

    getValues(beginDate: Date, endDate: Date): 
     Observable<Values> { 
     return this.http.get('http://localhost:54122/api/ProductionValues/GetProductionValuesDATETIME?startDate=' + beginDate +'&endDate=' + endDate) 
      .map(this.extractData) 
      .catch(this.handleError) 
    } 

    private extractData(res: Response) { 
     let body = res.json(); 
     return body || {}; 
    } 

    private handleError(error: any) { 
     // // In a real world app, we might use a remote logging infrastructure 
     // // We'd also dig deeper into the error to get a better message 
     let errMsg = (error.message) ? error.message : 
      error.status ? `${error.status} - ${error.statusText}` : 'Server error'; 
     console.error(errMsg); // log to console instead 
     return Observable.throw(errMsg); 
}

источник

2016-10-03 Marko

Это вопрос о угловом2, потому что вы передаете параметры диапазона на сервер api, может быть, вы должны обработать фильтрацию там? –

Я хочу выбрать диапазон дат в приложении с datepicker – Marko

Ваш сервер должен обрабатывать это, принимать эти параметры и возвращать только эти значения или возвращать все ваши данные и фильтровать их на стороне клиента (что не является хорошим вариантом). В соответствии с вашим API ваш сервер должен вернуть отфильтрованные данные. – Manish

Вопросы, это res.json() возвращает даты как строки. В конце концов я меняю отображение для HTTP GET звонков в моем приложении, чтобы выглядеть примерно так:

.map(res => { 
      let jsonData = res.json(); 
      for (let obj of jsonData) { 
       for (let prop in obj) { 
        if (moment(obj[prop], moment.ISO_8601).isValid()) { 
         obj[prop] = new Date(obj[prop]); 
        } 
       } 
      } 
      return jsonData; 
     })

В основном, это использует momentjs конвертировать любые строки в допустимом формате с датой фактического объекта вместо строки. Возможно, вам придется изменить параметр формата в зависимости от того, как данные возвращаются с сервера.

Кроме того, обратите внимание, что вам нужно будет сделать npm install moment по вашему проекту и import * as moment from 'moment'; на свой компонент, чтобы сделать эту работу.

источник

2017-05-30 22:18:28 yanbu

Как фильтровать данные json с датой datepicker Angular2 app

ответ

Смежные вопросы