เราไปดูตัวอย่างโค้ดหน้าเว็บ register ใน angular กันครับ

เริ่มด้วยหน้า template ตัวอย่างโค้ดตามด้านล่าง

<form (ngSubmit)="register()">
  <label for="name">Name:</label>
  <input type="text" id="name" [(ngModel)]="name" name="name" required>

  <label for="email">Email:</label>
  <input type="email" id="email" [(ngModel)]="email" name="email" required>

  <label for="password">Password:</label>
  <input type="password" id="password" [(ngModel)]="password" name="password" required>

  <button type="submit">Register</button>
</form>

จากนั้นใน component ก็จะได้ประมาณนี้

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  name: string;
  email: string;
  password: string;

  constructor(private http: HttpClient) { }

  register() {
    const user = {
      name: this.name,
      email: this.email,
      password: this.password
    };

    this.http.post('/api/register', user)
      .subscribe((response) => {
        // Handle successful registration
        console.log(response);
      }, (error) => {
        // Handle registration error
        console.log(error);
      });
  }
}

ตัวอย่างนี้จะเป็นตัวอย่างง่าย ๆ ในหน้า register สามารถนำไปปรับแต่งได้ ตามต้องการ