在Angular中,ngIf指令用于根据表达式的值来添加或移除DOM元素。如果在ngIf指令中输入的值发生改变,已选值将被移除。
以下是一个示例解决方案:
在组件的HTML模板中,使用ngIf指令和一个变量来控制DOM元素的显示/隐藏:
{{selectedValue}}
在组件的Typescript文件中,定义一个变量来控制showElement的值,并提供一个方法来更新selectedValue:
export class AppComponent {
showElement: boolean = true;
selectedValue: string = '已选值';
updateSelectedValue(newValue: string) {
this.selectedValue = newValue;
}
}
通过调用updateSelectedValue
方法来更新selectedValue的值,这将导致ngIf指令重新计算并移除已选值。
在组件的HTML模板中,添加一个按钮来调用updateSelectedValue
方法:
这样,当点击按钮时,已选值将被移除,并显示新的已选值。