Question

在这里，我使用的是典型的输入方案，其中我无法使用已分配给其他任务的反应式/模板表单结构和ngmodel。现在，我想为输入字段设置默认值，如果用户希望他可以更改更改

有可能

<input id="{{data.name}}" value="{{data.name}}"  type="{{data.type}}" [(ngModel)]="Edit[data.name]" class="form-control">

主要是我的问题在输入字段中的设置值，如果用户愿意，他可以将值更改为单个字段，或者将值设置为动态 ngmodel

Answer 1

尝试一下：

<input type="text"  [value]="data.name"/>

如果您仍然需要绑定方式

<input type="text"  [value]="test"  [(ngModel)]="test"/>

Answer 2

使用参考变量#inp

  OnInputClick(inp:any){   }//Typesctipt

<input id="{{data.name}}" value="{{data.name}}"  type="{{data.type}}" #inp class="form-control">
<button (click)="OnInputClick(inp.value)">Input</button>

Answer 3

使用keyup捕获事件并存储在.ts

 <input (keyup)="onKey($event)">

.ts

“ event.target.value”

具有用户输入的值，可根据需要使用

values ='' // provide a default value here whatever you want
onKey(event: any) { 
    this.values += event.target.value;
  }

Answer 4

根据Angular Document，您可以使用以下代码

<input  [value]="data.name" (input)="data.name=$event.target.value">

Answer 5

您也可以使用on blur event

只要用户离开您开始编辑的输入字段，这就会更新该值。

example.html：

<input #tsVarName (blur)="addBlurVal(tsVarName.value)" >

example.ts

export class example {
    globalVal = "";

    addBlurVal(localVar) {
         this.globalVal = localVal;
    }
 }

如何在Angular 2+中不使用ngmodel为输入设置值

5 个答案: