简体   繁体   English

提交后如何清理“textarea”和输入?

[英]How to clean the "textarea" and inputs after submit?

I'm using a Devextreme library (mentions).我正在使用 Devextreme 库(提及)。 Is there a way to submit (click on the Save button) to clear all the textarea information of the component and the other inputs?有没有办法提交(点击保存按钮)清除组件和其他输入的所有textarea信息?

I've tested several things but without success, I can't even clean the component's textarea.我已经测试了几件事,但没有成功,我什至无法清理组件的 textarea。

Can someone help me?有人能帮我吗?

DEMO 演示

CODE代码

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
    Open modal
  </button>
  <div class="modal fade" id="myModal">
    <div class="modal-dialog modal-dialog-centered">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">Modal Heading</h4>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <div class="modal-body">
          <div class="form-group">
    <label for="exampleFormControlInput1">Name</label>
    <input [(ngModel)]="name" type="text" class="form-control">
  </div>
  <div class="form-group">
    <label for="exampleFormControlInput1">Email address</label>
    <input [(ngModel)]="email" type="email" class="form-control">
  </div>
       <dx-html-editor (onValueChanged)="ment($event)"> 
    <dxi-mention
        valueExpr="text" 
        displayExpr="text"
        [dataSource]="employees"
    ></dxi-mention>
</dx-html-editor>

        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
           <button type="button" class="btn btn-primary" (click)="Save()">Save</button>
        </div>    
      </div>
    </div>
  </div>

You should get the instance/component and reset the value (Shown below).您应该获取实例/组件并重置值(如下所示)。

import { DxHtmlEditorComponent } from 'devextreme-angular';

@ViewChild(DxHtmlEditorComponent, {static: false}) dxHtmlEditor;

Save(){
   this.name = null;
   this.email = null;
   this.dxHtmlEditor.instance.reset()
 }

Working Demo工作演示
Read more here 在这里阅读更多

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM