在任何更改时自动编辑更新动态 table 内容
Edit updating dynamic table content automatically on any change
我在动态加载行内容的编辑模式中遇到了一些问题 table。当我单击编辑按钮时,模态使用 ngModel 加载行内容并从函数获取数据。问题是当我编辑模态内容时,table 内容会自动更新,无论我是否点击保存按钮。
我的按钮:
<button type="button" class="btn btn-light btn-sm" data-toggle="modal" (click)="passingData(pedido)" data-target="#EditarItem"><i class="fas fa-pen"></i></button>
我的函数:
passingData (data){
this._pedido = data;
this.pedido=this._pedido;
}
我的模态:
<div class="modal fade" id="EditarItem" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Editar Requisição</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form name="formRequisicao">
<div class="form-group">
<label for="exampleFormControlSelect1">Escolha o produto</label>
<select id="" class="form-control" name="produto" [(ngModel)]="pedido.nomeProduto">
<option *ngFor="let pd of produtos" value="{{pd.nome}}">{{pd.nome}}</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Quantidade</label>
<input class="form-control" name="quantidade" [(ngModel)]="pedido.quantidade" type="number" id="required"/>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">Data</label>
<input type="date" class="form-control" name="data" [(ngModel)]="pedido.data">
<span class="input-group-addon">
<i class="glyphicon glyphicon-calendar"></i>
</span>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" (click)="editarRequisicao()" data-dismiss="modal">Guardar produto</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
</div>
</div>
</div>
</div>
您正在与 [(ngModel)]
绑定,这意味着您从 source --> target 和 target --> source[=18 发送=],所谓的双向数据绑定。如果您省略这些括号 (),它将表现为输入 --> 从 源到目标 ,如果您更改某些内容,则必须单独处理它。
亲切的问候
我在动态加载行内容的编辑模式中遇到了一些问题 table。当我单击编辑按钮时,模态使用 ngModel 加载行内容并从函数获取数据。问题是当我编辑模态内容时,table 内容会自动更新,无论我是否点击保存按钮。
我的按钮:
<button type="button" class="btn btn-light btn-sm" data-toggle="modal" (click)="passingData(pedido)" data-target="#EditarItem"><i class="fas fa-pen"></i></button>
我的函数:
passingData (data){
this._pedido = data;
this.pedido=this._pedido;
}
我的模态:
<div class="modal fade" id="EditarItem" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Editar Requisição</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form name="formRequisicao">
<div class="form-group">
<label for="exampleFormControlSelect1">Escolha o produto</label>
<select id="" class="form-control" name="produto" [(ngModel)]="pedido.nomeProduto">
<option *ngFor="let pd of produtos" value="{{pd.nome}}">{{pd.nome}}</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Quantidade</label>
<input class="form-control" name="quantidade" [(ngModel)]="pedido.quantidade" type="number" id="required"/>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">Data</label>
<input type="date" class="form-control" name="data" [(ngModel)]="pedido.data">
<span class="input-group-addon">
<i class="glyphicon glyphicon-calendar"></i>
</span>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" (click)="editarRequisicao()" data-dismiss="modal">Guardar produto</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
</div>
</div>
</div>
</div>
您正在与 [(ngModel)]
绑定,这意味着您从 source --> target 和 target --> source[=18 发送=],所谓的双向数据绑定。如果您省略这些括号 (),它将表现为输入 --> 从 源到目标 ,如果您更改某些内容,则必须单独处理它。
亲切的问候