- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我在 firebase 上托管了一个 Angular 2 应用程序。我想通过电子邮件发送联系表格。理想情况下,我的解决方案将使用 Nodejs,但我愿意使用任何能够正确完成工作的东西。以下是我的应用程序的分割。
这是我的表格:
<!-- contact-form.component.html -->
<form [formGroup]="formService.contactForm" (ngSubmit)="formService.onSubmitForm()">
<input type="text" formControlName="userFirstName">
<label>First Name</label>
<input type="text" formControlName="userLastName">
<label>Last Name</label>
<button type="submit">SUBMIT</button>
</form>
这是我的联系表单组件:
// contact-form.component.ts
import { Component } from '@angular/core';
import { ContactFormService } from './contact-form.service';
@Component({
selector: 'contact-form',
templateUrl: './contact-form.component.html',
styleUrls: ['./contact-content.component.css'],
providers: [ContactFormService]
})
export class ContactFormComponent {
constructor(private formService: ContactFormService) {
formService.buildForm();
}
}
这是我的联系表单服务:
// contact-form.service.ts
import { Injectable } from '@angular/core';
import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
@Injectable()
export class ContactFormService {
constructor(public formBuilder: FormBuilder) { }
contactForm: FormGroup;
formSubmitted: boolean = false;
buildForm() {
this.contactForm = this.formBuilder.group({
userFirstName: this.formBuilder.control(null, Validators.required),
userLastName: this.formBuilder.control(null, Validators.required)
});
}
onSubmitForm() {
console.log(this.contactForm.value);
this.formSubmitted = true;
this.contactForm.reset();
}
}
当我点击提交按钮时,表单数据将成功显示在控制台中。
我可以使用 SendGrid 和 Nodejs 从命令提示符成功发送电子邮件:
例子:sendmail.js
var Sendgrid = require('sendgrid')(
process.env.SENDGRID_API_KEY || '<my-api-key-placed-here>'
);
var request = Sendgrid.emptyRequest({
method: 'POST',
path: '/v3/mail/send',
body: {
personalizations: [{
to: [{ email: 'my.email@gmail.com' }],
subject: 'Sendgrid test email from Node.js'
}],
from: { email: 'noreply@email-app.firebaseapp.com' },
content: [{
type: 'text/plain',
value: 'Hello Joe! Can you hear me Joe?.'
}]
}
});
Sendgrid.API(request, function (error, response) {
if (error) {
console.log('Mail not sent; see error message below.');
} else {
console.log('Mail sent successfully!');
}
console.log(response);
});
然后如果我在命令提示符中键入以下内容,电子邮件将成功发送:
node sendmail
但是,我不知道如何将我提交的表单数据链接到 sendmail.js,也不知道如何通过单击提交按钮激活 sendmail.js 中的代码。
如有任何帮助,我们将不胜感激。感谢您的宝贵时间!
最佳答案
尝试将您的 sendmail.js 重写为 rest 服务,例如:
const Sendgrid = require('sendgrid')(
process.env.SENDGRID_API_KEY || '<my-api-key-placed-here>'
);
const express = require('express');
const bodyParser = require('body-parser');
const app = express();
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
app.post('/send-mail', function (req, res) {
// PUT your send mail logic here, req.body should have your fsubmitted form's values
sendMail(req.body);
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.send('SEND MAIL');
})
app.listen(3000, function () {
console.log('LISTENING on port 3000');
})
function sendMail(formData) {
let request = Sendgrid.emptyRequest({
method: 'POST',
path: '/v3/mail/send',
body: {
personalizations: [{
to: [{ email: 'my.email@gmail.com' }],
subject: 'Sendgrid test email from Node.js'
}],
from: { email: 'noreply@email-app.firebaseapp.com' },
content: [{
type: 'text/plain',
value: `Hello ${formData.userFirstName} ${formData.userLastName}! Can you hear me ${formData.userFirstName}?.`
}]
}
});
Sendgrid.API(request, function (error, response) {
if (error) {
console.log('Mail not sent; see error message below.');
} else {
console.log('Mail sent successfully!');
}
console.log(response);
});
}
请注意,我在电子邮件正文中使用了表单数据
然后在你的提交函数中执行
http.post('http://localhost:3000/send-mail', this.contactForm.value);
关于node.js - 从 Angular 2 发送电子邮件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43192772/
在电子邮件中 Received: header 可以合法地多次出现,并且具有互斥的值... Received: three.example.com Received: two.example.co
是否有任何代码/宏可以合并到我的 sas 程序中,一旦我的 sas 代码在运行时发生错误,它会立即给我发送电子邮件? 另外,这封电子邮件是否可能包含发生的错误? 最佳答案 是的……也不是…… 这是可能
我有一个包含三个 td 的表格,每个表格都需要包含图像。 td 的宽度和高度是固定的,但图像大小可以变化。目标是在不扭曲单元格或图像本身的情况下拟合图像。不能使用 background-image 属
首先非常感谢大家过去提出的宝贵建议,我们正在创建一个应用程序,在某些事件中想要将电子邮件/短信发送到我们已经尝试过 openURL 调用的指定电话号码,但它会打开现有的内置iPhone 的电子邮件/短
我正在使用 apache commons mail 发送电子邮件。不幸的是,我遇到了以下异常: org.apache.commons.mail.EmailException: Sending the
我可以在我的 ~/.hgrc 文件中设置我常用的电子邮件地址,但是有没有办法为一个 hg 项目指定我想被称为不同的名称/电子邮件(类似到项目目录中的 git 的 .git/config 文件覆盖 ~/
$message = 'New user registration\n\n There is a new submission on the site and below are the detail
使用 outlook 我可以发送在邮件正文中插入图像的电子邮件(不是作为附件)。我如何使用 PHP 中的 mail() 函数来做到这一点? 最佳答案 我会推荐 Swift Mailer: http:/
以下代码的目标是将所选图表粘贴到我的文本下方的电子邮件正文中。但是,它继续将其粘贴在我的文本上方。我该如何更改它以使其粘贴在下面?谢谢! Set OutApp = CreateObject("Outl
首先,我知道不建议使用正则表达式发送电子邮件,但我必须对此进行测试。 我有这个正则表达式: \b[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b 在 Java 中,我这样
如何在没有任何第三方程序的情况下从 Python 发送电子邮件? 最佳答案 使用Python email和 smtplib模块。示例:http://docs.python.org/library/em
我目前正在使用此代码在 html 表中显示 mysql 记录 "; . . echo ' '. $row["Email1"] . ' '; . . echo ""; }
在电子邮件中使用 HTML 时,是否可以仅将链接的一部分着色为特定颜色? 我试过: red part of link normal part ...我知道如果我拆分链接是可能的,但我正在努力将它们保持
我正在处理一封 html 电子邮件,我有一个非常简单的元素 (ul),我想将它移到页面下方。 我检查了campaign monitor's guide并且不支持负边距,或者 position: abs
我使用表格创建了我的 HTML 电子邮件,该表格有一个背景图像,在大多数基于 Web 的电子邮件客户端中都能正常显示。 我正在努力让背景图片显示在 Outlook 中。 我最近的尝试,我尝试了以下操作
我对 PHP/CSS 和一般编程还很陌生。 我想改变文本区域中文本的格式,就像在这里所做的那样,例如,当为突出显示的文本添加标签“代码示例”时,它会缩进它,或者当将它设置为粗体时,它会加粗它。 这样做
嘿,你能推荐我哪些 C++ 库或类可用于在 C++ 中通过 SMTP 发送电子邮件。我在 Windows 平台上。我需要一个支持附件和 SSL 连接的库。有哪些可用选项。我不打算实现我自己的 :) 问
想知道是否可以在 HTML 电子邮件中包含一个表单。我要做的就是将图像输入提交到 Paypal 购买页面。我希望它直接进入 Paypal ,而无需先进入营销页面... 我会拥有 paypal 要求的完
我负责“ reshape ”我们的 IT 部门通信。我想用纯 HTML/CSS 来发送我们的电子邮件通知,以确保它的可移植性。 下面是代码,它在 Outlook 中看起来完全符合我的要求,但是一旦将内
我正在学习编写响应式电子邮件模板。目前我有:https://jsfiddle.net/q12yg2z6/
我是一名优秀的程序员,十分优秀!