我使用Angular 4和firebase作为我的后端。我想知道如何将此表格的详细信息直接发送到学校所有者的电子邮件中。假设我想向它发送一个在firebase中注册的特定电子邮件。我很擅长使用Firebase。
<md-card>
<h1 class=" mat-elevation-z12" style="text-align:center; background-color:crimson ;color:white; padding:10px;">Get in Touch With Us</h1>
<md-tab-group md-stretch-tabs>
<md-tab label="Phone">
<div class="text-center" style="color:crimson">
<h3 style="color:black">Give us a call</h3>
<p class="phone mat-body-2" >
<md-icon>phone</md-icon>
<strong> +91 7017514186</strong>
</p>
<p class="phone mat-body-2">
<md-icon>phone</md-icon>
<strong> +91 7417690098</strong>
</p>
<p class="phone mat-body-2">
<md-icon>phone</md-icon>
<strong> +91 8077530850</strong>
</p>
<p style="color: black">
<md-card-footer>Open Monday to Saturday, 7am - 2pm</md-card-footer>
</p>
</div>
</md-tab>
<md-tab-group>
</md-tab-group>
<md-tab label="Email" class="email-tab">
<div class="text-center">
<h3>Send us a message!</h3>
</div>
<form #contactForm="ngForm" (ngSubmit)="onContactFormSubmit(contactForm.value)">
<md-select name="subject" id="subject-select" placeholder="Subject" ngModel>
<md-option *ngFor="let reason of contactReasons" [value]="reason.value">
{{ reason.viewValue }}
</md-option>
</md-select>
<md-input-container>
<input mdInput placeholder="Email" name="email" type="email" ngModel>
</md-input-container>
<md-input-container>
<input mdInput placeholder="Phone" name="phone" type="phone" ngModel>
</md-input-container>
<md-input-container>
<textarea
mdInput
name="message"
placeholder="Write your message"
ngModel>
</textarea>
</md-input-container>
<div class="submit-area">
<md-checkbox name="optIn" ngModel>
Sign me up for the mailing list!
</md-checkbox>
<div class="submit-button-area">
<button
md-raised-button
type="submit"
name="submit"
[disabled]="!contactForm.value.message">
Submit
</button>
<button
md-raised-button
type="button"
(click)="onContactFormClear()">
Clear
</button>
</div>
</div>
<md-progress-bar mode="indeterminate" *ngIf="contactForm.submitting"></md-progress-bar>
</form>
</md-tab>
</md-tab-group>
</md-card>
export class ContactComponent implements OnInit {
contactReasons: Array<any> = [
{ value: 'admission', viewValue: 'Admission' },
{ value: 'complaint', viewValue: 'Complaint' },
{ value: 'general-question', viewValue: 'General Question' },
];
constructor() { }
ngOnInit() {
}
onContactFormSubmit(formData) {
console.log();
}
onContactFormClear() {
}
我在控制台上获得了正确的日志值,即json格式的表单值。