最近好吗?
我正在尝试弄清楚如何使用 Angular 5 和 Node.js(使用 nodemailer)发送电子邮件。
我想要存档的是,当某些用户在页面中进行预约时,系统会获取提供的电子邮件,并在用户单击“安排我的......”按钮时向用户发送一些信息。
正如你将看到的约会.组件.ts,当用户单击按钮时,变量更改为“true”以向用户显示一些隐藏的 div 并显示小吃栏,但什么也没有发生。控制台日志中没有错误,也没有任何错误。有任何想法吗?
下面是我的代码。提前致谢。
服务器.js
const express = require('express');
const path = require('path');
const http = require('http');
const bodyParser = require('body-parser');
const nodeMailer = require('nodemailer');
const api = require('./server/routes/api');
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static(path.join(__dirname, 'dist')));
app.use('/api', api);
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, 'dist/index.html'));
});
app.post('/sendemail', (req, res) => {
let transporter = nodeMailer.createTransport({
host: 'smtp.gmail.com',
port: 465,
secure: true,
auth: {
user: '[email protected] /cdn-cgi/l/email-protection',
pass: 'xxxxxxxxxxxxx'
}
});
let mailOptions = {
from: '"Nourish Team" <[email protected] /cdn-cgi/l/email-protection>',
to: "[email protected] /cdn-cgi/l/email-protection",
subject: 'Test',
text: 'Hello!',
html: '<b>Testing email function</b>'
};
transporter.sendMail(mailOptions, (error, info) => {
if(error) {
return console.log(error);
}
console.log('Message sent');
})
});
const port = process.env.PORT || '3000';
app.set('port', port);
const server = http.createServer(app);
server.listen(port, () => console.log(`API running on localhost:${port}`));
约会.component.html
<form novalidate action="/send-email" method="POST" (ngSubmit)="sendEmail()">
<mat-form-field class="middle-width" ngClass.xs="full-width">
<input matInput placeholder="Nombre Completo" [formControl]="fullName" required>
<mat-error *ngIf="fullName.hasError('pattern') && !fullName.hasError('required')">
El campo solo acepta letras.
</mat-error>
<mat-error *ngIf="fullName.hasError('required')">
¡Este cambo es <strong>requerido</strong>!
</mat-error>
</mat-form-field>
<mat-form-field class="middle-width" ngClass.xs="full-width">
<input matInput placeholder="Correo Electrónico" type="email" [formControl]="cEmail" required>
<mat-error *ngIf="cEmail.hasError('email') && !cEmail.hasError('required')">
Debes introducir un correo electrónico válido
</mat-error>
<mat-error *ngIf="cEmail.hasError('required')">
¡Este cambo es <strong>requerido</strong>!
</mat-error>
</mat-form-field>
<mat-form-field class="middle-width" ngClass.xs="full-width">
<input matInput placeholder="Teléfono" type="tel" [formControl]="phone" maxlength="14" mask="(000) 000 0000" required>
<mat-hint align="end">{{phone.value.length}} / 10</mat-hint>
<mat-error *ngIf="phone.hasError('pattern') && !phone.hasError('required')">
El campo sólo acepta números
</mat-error>
<mat-error *ngIf="phone.hasError('required')">
¡Este cambo es <strong>requerido</strong>!
</mat-error>
</mat-form-field>
<mat-form-field class="middle-width" ngClass.xs="full-width">
<input matInput [matDatepicker]="picker" placeholder="Elegir fecha">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker touchUi="true" #picker></mat-datepicker>
</mat-form-field>
<br>
<button mat-raised-button type="submit">Schedule My Appointment</button>
</form>
约会.组件.ts
sendEmail() {
this.sucess = true;
this.snackBar.open('Información enviada exitosamente.', 'x', {
duration: 5000,
});
this.name = this.fullName.value;
this.http.post('/sendemail', this.cEmail).subscribe(data => {
console.log(data);
});
}
我假设这段代码是将 node.js 代码连接到 Angular 5 应用程序中:this.http.post('/sendemail', this.cEmail).subscribe(data => {console.log(data);});