src/app/crm/lead/new/new.component.ts
| selector | apm-manage-new |
| styleUrls | ./new.component.scss |
| templateUrl | ./new.component.html |
Properties |
|
Methods |
constructor(dialogRef: MatDialogRef
|
||||||||||||
|
Defined in src/app/crm/lead/new/new.component.ts:18
|
||||||||||||
|
Parameters :
|
| createForm |
createForm()
|
|
Defined in src/app/crm/lead/new/new.component.ts:30
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Defined in src/app/crm/lead/new/new.component.ts:28
|
|
Returns :
void
|
| onSubmit |
onSubmit()
|
|
Defined in src/app/crm/lead/new/new.component.ts:48
|
|
Returns :
void
|
| addForm |
Type : FormGroup
|
|
Defined in src/app/crm/lead/new/new.component.ts:13
|
| Public data |
Type : any
|
Decorators :
@Inject(MAT_DIALOG_DATA)
|
|
Defined in src/app/crm/lead/new/new.component.ts:22
|
| dialogClose |
Type : boolean
|
Default value : false
|
|
Defined in src/app/crm/lead/new/new.component.ts:11
|
| Public dialogRef |
Type : MatDialogRef<NewComponent>
|
|
Defined in src/app/crm/lead/new/new.component.ts:21
|
| formErrors |
Type : object
|
Default value : {
username: '',
email: '',
password: ''
}
|
|
Defined in src/app/crm/lead/new/new.component.ts:14
|
import { Component, OnInit, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@Component({
selector: 'apm-manage-new',
templateUrl: './new.component.html',
styleUrls: ['./new.component.scss']
})
export class NewComponent implements OnInit {
dialogClose: boolean = false;
addForm: FormGroup;
formErrors = {
username: '',
email: '',
password: ''
};
constructor(
public dialogRef: MatDialogRef<NewComponent>,
@Inject(MAT_DIALOG_DATA) public data: any,
private fb: FormBuilder
) {
this.createForm();
}
ngOnInit() {}
createForm() {
this.addForm = this.fb.group({
username: ['', [Validators.maxLength(32)]],
email: ['', [Validators.required, Validators.email]],
password: [
'',
[
Validators.pattern('^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'),
Validators.minLength(6),
Validators.maxLength(16)
]
],
password_confirm: '',
phone: '',
agree: ''
});
}
onSubmit() {
console.log(this.addForm.value);
this.dialogRef.close();
}
}
<h2 mat-dialog-title>添加</h2>
<mat-dialog-content>
<form [formGroup]="addForm" (ngSubmit)="onSubmit()">
<mat-form-field class="display-block">
<input matInput placeholder="请输入姓名" formControlName="username" required maxlength="10">
<mat-error *ngIf="formErrors.username">{{formErrors.username}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入邮箱" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入电话" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入手机" formControlName="phone" minlength="11" maxlength="11">
<mat-hint align="end">{{addForm.value.phone?.length || 0}}/11</mat-hint>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入地区" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入地址" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入职务" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入公司名称" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入网址" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
<mat-form-field class="display-block">
<input matInput placeholder="请输入跟进状态" formControlName="email">
<mat-error *ngIf="formErrors.email">{{formErrors.email}}</mat-error>
</mat-form-field>
</form>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close>取消</button>
<button mat-raised-button color="primary" cdkFocusInitial (click)="onSubmit()">提交</button>
</mat-dialog-actions>
./new.component.scss
.display-block {
display: block;
}