My Blog

My WordPress Blog

My Blog

My WordPress Blog

Data Binding

Enhance the UserComponent to allow for two-way data binding and interaction with the form:

// src/app/user/user.component.ts
import { Component, OnInit } from '@angular/core';
import { UserService } from '../user.service';

@Component({
  selector: 'app-user',
  template: `
<h1>User List</h1>
<ul>
  <li *ngFor="let user of users">
    {{ user.name }} ({{ user.email }})
  </li>
</ul>
<a routerLink="/add-user">Add New User</a>
` }) export class UserComponent implements OnInit { users: any[] = []; constructor(private userService: UserService) { } ngOnInit(): void {
this.userService.getUsers().subscribe(data => {
  this.users = data;
});
} }
Data Binding

Leave a Reply

Your email address will not be published. Required fields are marked *

Scroll to top