如何清除离子角todo例子中的模态

Question

我注意到在离子todo应用程序示例中,如果我取消模态并再次打开它,过时/旧的待办事项信息仍保留在模态上.清除/重置旧模态数据的最佳位置是什么,以便在取消或提交模态表单字段后始终有新的空白字段？

我应该删除或清除任务对象吗？在关闭时手动重置字段并创建？为某种隐藏事件添加处理程序？

这是角度/离子的例子:

http://ionicframework.com/docs/guide/building.html

以及相关的代码片段

 // Called when the form is submitted
  $scope.createTask = function(task) {
    $scope.tasks.push({
      title: task.title
    });
    $scope.taskModal.hide();
    task.title = "";
  };

  // Open our new task modal
  $scope.newTask = function() {
    $scope.taskModal.show();
  };

  // Close the new task modal
  $scope.closeNewTask = function() {
    $scope.taskModal.hide();
  };

和模态

<div class="modal">

<!-- Modal header bar -->
<ion-header-bar class="bar-secondary">
  <h1 class="title">New Task</h1>
  <button class="button button-clear button-positive" ng-click="closeNewTask()">Cancel</button>
</ion-header-bar>

<!-- Modal content area -->
<ion-content>

  <form ng-submit="createTask(task)">
    <div class="list">
      <label class="item item-input">
        <input type="text" placeholder="What do you need to do?" ng-model="task.title">
      </label>
    </div>
    <div class="padding">
      <button type="submit" class="button button-block button-positive">Create Task</button>
    </div>
  </form>

</ion-content>

Answer 1

我遇到了同样的问题.我首先尝试通过在关闭我的模态窗口时清除模型对象来清除我的表单数据,就像你一样,但这只适用于我提交表单的时候.取消时,它不起作用!(即使在隐藏弹出窗口之前明确清除对象,它也不起作用)

我最终通过这样做修复了它:

$scope.newTask = function() {
   $scope.task = {};
   $scope.taskModal.show();
};

这样,每次加载窗口时,都会清除模型.所以诀窍不是在提交数据时这样做,而是在打开模态窗口时.这至少对我有用.

顺便说一句,我还需要一个编辑功能用于同一个模态窗口,所以我这样做:

$scope.editTask = function(task) {
   $scope.task = task;
   $scope.taskModal.show();
};