要实现Angular 2中的双向绑定,并且使一个字段启用,另一个字段禁用,可以使用Angular的[disabled]
属性绑定来实现。
以下是一个示例代码,展示了如何实现该功能:
HTML模板:
组件代码:
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
inputValue: string = "";
disableInput: boolean = false;
toggleInput() {
this.disableInput = !this.disableInput;
}
}
在上面的代码中,通过使用[(ngModel)]
来实现双向绑定,将输入框的值绑定到了inputValue
属性上。使用[disabled]
属性绑定,将disableInput
属性的值绑定到了输入框的disabled
属性上,从而实现了禁用输入框的功能。
点击按钮时,会调用toggleInput()
方法,该方法会切换disableInput
属性的值,从而实现启用和禁用输入框的功能。
希望以上代码能够帮助到您!