Блог

Главная - Вопросы по программированию - Использование интерфейса Typescript в качестве HttpParams в запросе GET

Использование интерфейса Typescript в качестве HttpParams в запросе GET

#angular #http

#angular #http

Вопрос:

У меня есть интерфейс, подобный приведенному ниже

 export interface ValueList {
  attributeId: number;
  attributeName: string;    
}

И мой HTTP-запрос GET выглядит следующим образом

 public getData(columnId: number, columnName: string) {
  const url = './assets/portfoliolist.json';
  return this.httpClient.get(`${url}?attributeId=${columnId}amp;attributeName=${columnName}`);
}

Итак, в основном я не использую интерфейс, который я определил. Я не совсем уверен, как я могу использовать этот интерфейс в запросе GET для создания параметров запроса? Пожалуйста, предложите. Спасибо.

Комментарии:

1. Из интереса, может ли сервер обрабатывать параметры запроса, когда вы извлекаете статические файлы json?

Ответ №1:

Вариант 1:

getData объявляет единственный параметр (типа ValueList ), значения которого извлекаются с помощью деструктурирования следующим образом:

 public getData({ attributeId, attributeName }: ValueList) {
  const url = './assets/portfoliolist.json';
  return this.httpClient.get(`${url}?attributeId=${attributeId}amp;attributeName=${attributeName}`);
}

Вариант 2:

 public getData(p: ValueList) {
  return this.httpClient.get(`${url}`, { params: new HttpParams({ fromObject: p}) });
}

Ответ №2:

Если вы хотите сделать это внутри метода getData, вы можете сделать это следующим образом.

 public getData(columnId: number, columnName: string) {
    const url = './assets/portfoliolist.json';
    const valueList: ValueList = { attributeId: columnId, attributeName: columnName };

    let httpParams = new HttpParams();
    httpParams = httpParams.append('attributeId', valueList.attributeId.toString());
    httpParams = httpParams.append('attributeName', valueList.attributeName);

    return this.httpClient.get(
      url,
      {
        params: httpParams
      }
    );
  }

Вы также можете извлечь код генерации модели и параметров запроса в любое место по мере необходимости и передать параметр запроса в качестве входных данных методу getData.