javascript - 将项目插入数组后如何清除输入字段?

标签 javascript angularjs angular ionic2 angular2-routing

我做了一个 Angular 2 的简单示例。我在数组中添加了项目。当用户输入任何内容并按下按钮时,它会被添加到数组中并显示在列表中。

我面临两个问题

  • 1)如何在pusing到数组后清除输入字段?
  • 2) Angular 2 是如何工作的?如文档 Angular 2 中删除 watch 。所以 当项目添加到数组中时。模板如何显示更新的列表。如何?

    是看list的模型吗?

这是我的 plunker code

<ion-navbar *navbar>
  <ion-title>
    Ionic 2
  </ion-title>
</ion-navbar>

<ion-content class="has-header">
 <ion-list style="border:2px solid grey;height:500px">
  <ion-item *ngFor="#item of Todo">
{{item.name}}
  </ion-item>
</ion-list>
<label class="item item-input">
  <span class="input-label" >Add Todo</span>
  <input type="text" #todo placeholder="Add todo" >
</label>
</ion-content>

<ion-footer-bar (click)="addItem(todo.value)">

  <h1 class="title" style='color:red'>Add Todo!</h1>

</ion-footer-bar>

最佳答案

您也可以在点击事件上执行以下操作,而不是清除函数中的值:-

<ion-footer-bar (click)="addItem(todo.value);todo.value = ''">

  <h1 class="title" style='color:red'>Add Todo!</h1>

</ion-footer-bar>

Working Plunker

关于javascript - 将项目插入数组后如何清除输入字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37383394/

相关文章:

javascript - Promise.prototype.then() 行为

html - 将 div 放置在不同宽度的图像内

javascript - 通过AJAX、PHP获取值

javascript - 如何将 jwt 身份验证与 ACL 混合使用

javascript - Smart-Table - 预选特定行

javascript - 多菜单级别 Angular js

javascript - 通过 AngularJS 和 json 对象对测验进行评分

javascript - 当 2 个数组更新时,angularjs 调用 watch

javascript - SonarQube 显示为 'remove this useless assignment to local variable'

ios - 如何将 Autodesk Forge Viewer 嵌入移动应用程序?