Машинопись не умеет читать картуиз данных JSON

Question

Я использую Angular5 в приложении с весенней загрузкой.Я пытаюсь вернуть карту в формате JSON.

Spring:

//some method
return ResponseEntity.ok((new Gson()).toJson(/*My map object*/));

Angular5:

sql_list = new Map<string,string>();
this.myService.getQueries().subscribe(
    data => {
        console.log("Received data: ");
        console.log(data);
        this.sql_list = data;
        console.log(this.sql_list.get("query1"));
    } 
);

В клиенте я вижу, что данные хорошо принимаются с помощью console.log:

Received data:
{
  "query1" : "select * from test",
  "query2" : "select * from test2",
  "query3" : "select * from test3"
}

Но sql_list объект выдает мне эту ошибку при попытке использовать map.get(string key) метод:

ОШИБКА TypeError: _this.sql_list.get не является функцией

Какую ошибку я там совершил?

РЕДАКТИРОВАТЬ: после ответа Флориана это работает:

this.sql_list = new Map<string, string>(Object.entries(data));

Answer 1

Когда вы делаете this.sql_list = data, вы перезаписываете то, что sql_list было раньше, поэтому оно больше не Map<string, string>.* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - такой то, что будет sql_list.

Не так много случаев, когда вам нужно использовать Map<string, string> вместо простых объектов, потому что вы можете получить доступ к значениям объекта, выполнив индексирование следующим образом: sql_list['query1'].чтобы сделать это возможным в машинописном тексте, вы должны объявить sql_list как тип any или создать свой собственный тип, например тип строкового преобразователя, подобный этому:

interface strMap {
  [key: string]: string;
}

, тогда вы просто объявляете sql_list: strMap;.

Если у вас все еще есть веские основания для использования Map<string, string>, вы можете посмотреть на этот вопрос

Answer 2

Как объяснил Флориан, вы назначаете плоскому объекту JSON что-то, что должно быть Map Одна вещь, которую вы можете сделать, если вы действительно хотите, чтобы она была Map, это сделать

for (const key in data) {
    this.sql_list.set(key, data[key]);
}

Этоперебирает все ваши ключи ('query1', 'query2', 'query3') и затем устанавливает значение этого ключа на вашей карте

Просто интересно, почему вы используете Map, потому что есливы уже знаете, как будет выглядеть ваш объект и какие поля у него будут, почему бы вам просто не создать класс и не ввести его в качестве этого класса?

Просто предложение.Также проще, когда вы пишете код в VS Code, например, у вас будет автозаполнение

Answer 3

В первой строке вы создаете карту:

sql_list = new Map<string,string>();

Но позже в обработчике данных вы просто перезаписываете этот объект полученными данными:

this.sql_list = data;

Поскольку data является чем-то, возвращаемым обработчиком HTTP, он, скорее всего, не будет поддерживать интерфейс Map и не будет предлагать такие функции, как get.Вместо этого это будет простой объект JavaScript, который вы могли бы читать как console.log(sql_list['query1']).

. Вы могли бы использовать некоторую умную комбинацию Object.keys() и set() (вашего пустого объекта Map, хранящегося в sql_list) чтобы "преобразовать" возвращенный объект JavaScript data в полный Map объект.