发表于: 2019-10-01 21:22:35

0 841


今天完成的事情:

登录模块

import { Component, OnInit } from '@angular/core';

import { FormBuilder, FormGroup, Validators } from '@angular/forms';

@Component({

  selector: 'nz-demo-form-normal-login',

  template: `

    <form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">

      <nz-form-item>

        <nz-form-control nzErrorTip="Please input your username!">

          <nz-input-group nzPrefixIcon="user">

            <input type="text" nz-input formControlName="userName" placeholder="Username" />

          </nz-input-group>

        </nz-form-control>

      </nz-form-item>

      <nz-form-item>

        <nz-form-control nzErrorTip="Please input your Password!">

          <nz-input-group nzPrefixIcon="lock">

            <input type="password" nz-input formControlName="password" placeholder="Password" />

          </nz-input-group>

        </nz-form-control>

      </nz-form-item>

      <nz-form-item>

        <nz-form-control>

          <label nz-checkbox formControlName="remember">

            <span>Remember me</span>

          </label>

          <a class="login-form-forgot" class="login-form-forgot">Forgot password</a>

          <button nz-button class="login-form-button" [nzType]="'primary'">Log in</button>

          Or

          <a>register now!</a>

        </nz-form-control>

      </nz-form-item>

    </form>

  `,

  styles: [

    `

      .login-form {

        max-width: 300px;

      }

      .login-form-forgot {

        float: right;

      }

      .login-form-button {

        width: 100%;

      }

    `

  ]

})

export class NzDemoFormNormalLoginComponent implements OnInit {

  validateForm: FormGroup;

  submitForm(): void {

    for (const i in this.validateForm.controls) {

      this.validateForm.controls[i].markAsDirty();

      this.validateForm.controls[i].updateValueAndValidity();

    }

  }

  constructor(private fb: FormBuilder) {}

  ngOnInit(): void {

    this.validateForm = this.fb.group({

      userName: [null, [Validators.required]],

      password: [null, [Validators.required]],

      remember: [true]

    });

  }

}

明天要做的事情:拆禅道

遇到的问题:太慢


返回列表 返回列表
评论

    分享到