Question

我有一张表格：

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

我想从我的控制器向placeThis.target添加默认值，如下所示：

$scope.placeThis = { target: 0 }

但是，如果我不添加$scope.$apply或将其包含在$timeout内（这将为我运行$scope.$apply），则无效。

我可以从控制器中保存其他$ scope值而没有任何问题，但是表单中的值大部分写在$timeout内，或者在提交时丢失。为什么会这样？

Answer 1

请参阅下面的演示

您需要在＆＃39; placeThis＆＃39;更改表单名称。其他类似于＆＃39; placeThisForm＆＃39; 否则你会覆盖控制器中设置的$scope.placeThis值。

请参阅下面的演示

＆＃13;

var app = angular.module('app', []);

app.controller('homeCtrl', function($scope) {

  $scope.placeThis = {
    target: "One",
    name: "Tim"

  };


});

＆＃13;

<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>

＆＃13;

Answer 2

我认为您的问题出在表单名称中。您可以在此处阅读有关角形的更多信息https://docs.angularjs.org/api/ng/directive/form。它说：

如果指定了name属性，则表单控制器将以此名称发布到当前作用域。

因此，在该范围内以此名称存储的不同对象。尝试设置不同的表单名称，如下所示：

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

在你的控制器中：

$scope.placeThis = { target: 0 }

设置初始值的另一种方法是使用 ng-init

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

为什么在表单中填充ng-model应该跟$ scope。$ apply？

2 个答案:

请参阅下面的演示