javascript - 为什么在表单内填充 ng-model 后应该跟上 $scope.$apply？

Question

我有一个表格:

<form name="placeThis" id="placeThis" novalidate ng-submit="submitForm();">
    <input type="hidden" ng-model="placeThis.target"/>
</form>

我想从我的 Controller 向 placeThis.target 添加默认值，如下所示:

$scope.placeThis = { target: 0 }

但是如果我不添加 $scope.$apply 或将其包装在 $timeout 中(这将运行 $scope.$apply)，它就不起作用 对我来说)。

我可以毫无问题地保存 Controller 中的其他 $scope 值，但表单内的值大多数都写在 $timeout 内，否则它们会在提交时丢失。为什么会发生这种情况？

Answer 1

请参阅下面的演示

您需要将表单名称从“placeThis”更改为“placeThisForm”等其他名称否则您将覆盖 Controller 中设置的 $scope.placeThis 值。

请参阅下面的演示

var app = angular.module('app', []);

app.controller('homeCtrl', function($scope) {

  $scope.placeThis = {
    target: "One",
    name: "Tim"

  };


});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div ng-controller="homeCtrl">
    <form name="placeThisForm" id="placeThis" novalidate ng-submit="submitForm();">
      <label>Target</label>
      <input type="text" ng-model="placeThis.target" />
      <label>Name</label>
      <input type="text" ng-model="placeThis.name" />
    </form>
  </div>
</div>