Question

我在s3存储桶中有一个角度应用程序。它正在运行伟大的路由工作等。我想要做的是将角形式合并到我的应用程序中并在后端使用AWS Lambda。我的问题是我知道如何使用AWS Lambda从基本前端表单传递信息这是我使用jQuery的示例：

＆＃13;

$(document).ready(function(){
    $('#contact-form-button').on('click', function(e){
        AWS.config.update({region: 'us-east-1'});
        AWS.config.credentials = new AWS.Credentials('XXXXXXXXXXXX', '0000000000000');
        var lambda = new AWS.Lambda({region: 'us-east-1', apiVersion: '2015-03-31'});

        var pullParams = {
            FunctionName: 'marketing-web-dev-createFeedback',
            InvocationType: 'RequestResponse',
            LogType: 'Tail',
            Payload: JSON.stringify({
                "feedback_id": makeid(),
                "name": $('#name').val(),
                "email": $('#email').val(),
                "subject": $('#subject').val(),
                "message": $('#message').val()
            })
        };

        lambda.invoke(pullParams, function(error, data) {
            if (error) {
                prompt(error);
            } else {
                pullResults = JSON.parse(data.Payload);
            }
        });
        var pullResults;
        return false;
    });
});
function makeid(){
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    for( var i=0; i < 5; i++ )
        text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
}

＆＃13;

我如何使用角度组件做同样的事情？这是基本组件的存根：

＆＃13;

import { Component, OnInit } from '@angular/core';
import { FormGroup,  FormBuilder } from '@angular/forms';

import { Customer } from './customer';

@Component({
    selector: 'my-signup',
    templateUrl: './app/customers/customer.component.html'
})
export class CustomerComponent implements OnInit {
    customerForm: FormGroup;
    customer: Customer= new Customer();

    constructor(private fb: FormBuilder){}

    ngOnInit(): void {
        this.customerForm = this.fb.group({
            feedback_id: '',
            name: '',
            email: '',
            subject: '',
            message: ''
        });

    }

    save() {
        console.log(this.customerForm);
        console.log('Saved: ' + JSON.stringify(this.customerForm.value));
    }
 }

＆＃13;

我只是没有就如何整合AWS Lambda and Angular

建立联系

Answer 1

如果您的jquery示例有效，那么您应该能够在Angular中使用相同的代码。将Lambda调用代码移动到Angular组件保存方法中，并将字符串化的customerform值插入Lambda请求有效负载（而不是jquery字段提取）。请记住声明AWS：任何使得Typescript在编译AWS调用时不会失败。

也就是说，更简洁的方法是您还使用AWS API Gateway为Lambda调用创建HTTP POST API。然后从Angular你只需要使用http.post。

何处将AWS Lambda代码集成到Angular应用程序中？

1 个答案: