Question

为什么这三条注释掉的行不起作用？虽然它们确实将输入字段重置为空，但输出也完全为空。只有通过重新分配给对象才能正常工作。（为了简洁，省略了我的工厂文件Users.create，它执行了http get）

在两种情况下，似乎“兄弟”在“嘿”之前被记录，我的猜测是3行在重新分配$ scope.newUser进入User.create之前，但是不会$ scope.newUser = {}也这样做？

  $scope.addUser = function (){
    Users.create($scope.newUser).then(function() {
      // console.log('hey');
      $scope.displayUsers();
    })

    $scope.newUser = {};
    console.log('bro');
    // $scope.newUser.name = '';
    // $scope.newUser.email = '';
    // $scope.newUser.id = '';``
  };

相关HTML

<div ng-controller="AppController">
  <h1>Testing</h1>

  <form ng-submit="addUser()">
    <input ng-model="newUser.name" placeholder="Your Name">
    <input ng-model="newUser.email" placeholder="Email">
    <input ng-model="newUser.id" placeholder="Id">
    <input type="submit" value="Add User"/>
  </form>

  <!-- <button ng-click="addUser()">Add User</button> -->
  <button ng-click="displayUsers()">View current Users</button>      

  <ul>
    <li ng-repeat="user in users track by $index" ng-click="removeUser()">
      Name: {{ user.name }}  <br>Email: {{user.email}} <br> Id: {{user.id}}
    </li>
  </ul>

我现在明白你必须把这三行归结为javascript的异步性质然后回调，但为什么你不需要用$ scope.newUser = {}做同样的事情？

Answer 1

正如@Chandermani所说，这是我们最初遇到的经典异步问题。 $http和$resource中的Angular方法会返回承诺，这些承诺将来会被填满或拒绝。此外，在处理promises时，请记住始终使用catch处理错误。

$scope.addUser = function () {
  Users.create($scope.newUser).then(function () {
    console.log('Second!');
    $scope.newUser = {};
  }).catch(function (err) {
    console.log('Something wrong happened!');
  });

  console.log('First!');
};

通过创建新对象与重新分配属性来重置角度输入

1 个答案: