綁定表單 [(ngModel)]
[(ngModel)]必須引入FormsModule
[ngClass]=”{‘disabled’:item.isEdit}”
[ngClass]必須引入NgClass
Html
1
2
3
4
| <input *ngIf="item.isEdit" [(ngModel)]="item.name"/>
<p *ngIf="!item.isEdit"> {{item.name}}</p>
<button class="btn btn-danger ml-2" (click)="remotePost(item.user_id,index)" [ngClass]="{'disabled':item.isEdit}">Delete</button>
|
Ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| import { Component, OnInit } from '@angular/core';
+ import { NgIf } from '@angular/common';
+ import { FormsModule } from '@angular/forms';
@Component({
selector: 'app-login',
standalone:true,
+ imports: [ FormsModule ,NgIf],
templateUrl: './login.component.html',
styleUrl: './login.component.scss'
})
export class LoginComponent implements OnInit {
ngOnInit(): void {}
}
|
Angular CRUD