Question

设置清除输入字段时出现问题

我正在尝试在添加新指令文本后清除ng-model =“newInstruction.instructionText”上的输入框。这是我尝试将其重置为空字符串但输入字段未清除的代码。这是为什么？

我已尝试在updateInstructionText函数中记录以下控件：

Console.log（newInstruction）在控制台中返回undefined。

Console.log（$ scope.newInstruction）在控制台中返回undefined。

Console.log（指令）返回一个带有指令文本的对象，位于ex：Object {instructionText：'new instruction'}

控制器：

angular.module('app').controller('InstructionController', function($scope, $http, NgTableParams, $filter) {
  $scope.initList = function() {
    $scope.getRemoteInstructions = function(typed) {
      $http.get("/api/instructions?searchInstructionText=" + typed).then(function(response) {
        $scope.instructionChoices = _.map(response.data, function(instruction) {
          instruction.instructionText;
        });
      });
    };
    $scope.updateInstructionText = function(instruction) {
      var instructionPromise;
      if (instruction.id) {
        instructionPromise = $http.put("api/instructions/" + instruction.id, instruction);
      } 
      else {
        instructionPromise = $http.post("/api/instructions", instruction);
      }

      $scope.newInstruction = '';
      $instruction = '';

      instructionPromise.then(function(response) {
        $('#instructionModal').closeModal();
        $scope.instructionTable.reload();
      });
    };
  };
});

HTML

<div class="container-fluid" ng-init="initList()">
  <div class="row">
      <h3>Total Instructions: {{totalInstructions}}</h3>
      <table class="striped highlight bordered" ng-table="instructionTable" show-filter="true">
        <tr>
          <td class="input-field">
            <input placeholder="Enter New Instruction Text" ng-model="newInstruction.instructionText" type="text">
          </td>
          <td>
            <a class="waves-effect waves-light btn" ng-click="updateInstructionText(newInstruction)">Add</a>
          </td>
        </tr>
      </table>
    </div>
  </div>
  <ng-include src="'/views/modals/instructionModal.html'"></ng-include>
</div>

Answer 1

简单地说：

instruction.instructionText = null

由于您正在使用name指令访问函数内的参数（对象），如果将其设置为null，则可以清除输入字段

Answer 2

简单地说 $ scope.newInstruction.instructionText =空

设置清除输入字段AngularJS时遇到问题

2 个答案: