Создание выходных данных JSON из формы Angular 2 для использования в бессерверной контактной форме на базе AWS.

Я пытаюсь написать контактную форму в Angular 2, которая вызывает AWS API Gateway, предоставляя адрес/имя/сообщение электронной почты пользователя в формате JSON:

  {
      "email": "[email protected]",
      "phone": "1234567890",
      "name": "John Smith",
      "message": "A test message"
    }

У меня есть AWS API Gateway, настроенный для получения вышеуказанного формата JSON, и AWS Lambda, настроенная и протестированная для использования AWS SES для отправки электронной почты при получении вышеуказанных данных в формате JSON. Эти части цепочки работают.

Я очень новичок в Angular 2 и создал формы в соответствии с примерами, но теперь не знаю, как приступить к созданию формы и для нее JSON Stringify вывод на мой URL-адрес шлюза API и использовать службу HTTP для отправки этих данных к моей конечной точке шлюза API.

Мне было интересно, может ли кто-нибудь предложить свежий подход?

Большое спасибо всем :)


person Frazer    schedule 26.03.2017    source источник
comment
вам нужно отправить данные формы на определенный URL-адрес?   -  person isuruAb    schedule 26.03.2017
comment
Да — я создал конкретную конечную точку шлюза AWS API: xxxxxxx.execute- api.eu-west-1.amazonaws.com/prod, чтобы я мог получать соответствующие данные в формате JSON. Я использовал этот блог codeengine.com/articles/process-form -aws-api-gateway-lambda для настройки шлюза API / Lambda, но я действительно изо всех сил пытаюсь понять, как написать форму Angular2 для обработки вывода в виде JSON и отправки в шлюз API. Я изучаю формы, но не могу найти ничего особенного для создания JSON и отправки его по URL-адресу вызова.   -  person Frazer    schedule 26.03.2017
comment
Я попытался использовать код из [link]stackoverflow.com/questions/39698247/   -  person Frazer    schedule 02.04.2017
comment
который я изменил на новый компонент с FormGroup и FormBuilder, добавленными в мой app.module, но я получаю неожиданное значение «FormGroup», импортированное модулем «AppModule». Пожалуйста, добавьте аннотацию @NgModule. ошибка из консоли - хотя я добавил в объявления FormGroup и FormBuilder. Любые идеи, пожалуйста, кто-нибудь??? Я действительно просто хочу получить работающую форму, создающую JSON и отправляющую ее в мой API, из которой я могу учиться :)   -  person Frazer    schedule 02.04.2017
comment
импортируйте FormGroup и FormBuilder вместо их объявления. Пожалуйста, добавьте свои коды, если вам нужны дополнительные разъяснения.   -  person isuruAb    schedule 02.04.2017
comment
json-form.component.ts - не дает добавить код - слишком длинно на 354 символа.... - так что выложу в трех сообщениях...   -  person Frazer    schedule 02.04.2017
comment
сделайте планкер (plnkr.co) и опубликуйте соответствующий URL. вам не нужно публиковать его как три комментария. вы можете отредактировать вопрос и добавить туда другие коды   -  person isuruAb    schedule 02.04.2017
comment
Немного изо всех сил пытаюсь получить настройку плунжера angular 2/4 по умолчанию и заставить это работать. Plunker предлагает максимум AngularJS 1.5x — без angular 2 или 4.   -  person Frazer    schedule 11.04.2017
comment
Может ли кто-нибудь предложить пример кода, пожалуйста? Я боролся сейчас со многими примерами и просто не могу заставить это работать. Я бы хотел просто поработать над «рабочим примером» кода, чтобы узнать.... :)   -  person Frazer    schedule 15.04.2017


Ответы (1)


Получил прекрасный ответ на этот вопрос:

Создайте Контактная форма в Angular 2/4, которая ОТПРАВЛЯЕТ JSON в указанный API

Пожалуйста, попробуйте также плунжер: он отлично отвечает на вопрос :)

БОЛЬШОЕ спасибо @Tiep Phan за очень подробный и быстрый ответ.

person Frazer    schedule 17.04.2017