为什么里面填充NG形式的模式应遵循$范围。$申请？ [英] Why populating ng-model inside forms should be followed by $scope.$apply?

问题描述

我有一个表格：

 ＆LT;表格名称=placeThisID =placeThisNOVALIDATE NG-提交=submitForm（）;＆GT;
    ＆LT;输入类型=隐藏NG-模式=placeThis.target/＆GT;
＆LT; /表及GT;
 

和我想的默认值从我的控制器添加到 placeThis.target ，就像这样：

  $ scope.placeThis = {目标：0}
 

但是，如果我不是加入 $范围它不工作。$适用或者其包装 $超时内 （这将运行 $范围。$适用对我来说）。

我可以从控制器节省$其他范围值没有任何问题，但里面的形式最看重的 $超时或他们迷失在里面提交写入。为什么会出现这种情况？

解决方案

请参阅下面的演示

您需要从placeThis表单来改变名称别的东西像'placeThisForm
否则，你覆盖 $ scope.placeThis 在你的控制器值设置的。

请参阅下面的演示

\r

\r

VAR应用= angular.module（'应用'，[]）;\r
\r
app.controller（'homeCtrl'，函数（$范围）{\r
\r
  $ scope.placeThis = {\r
    目标：一，\r
    名称：蒂姆\r
\r
  };\r
\r
\r
}）;

\r

＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r
\r
＆LT; D​​IV NG-应用=应用程序＆GT;\r
  ＆LT; D​​IV NG控制器=homeCtrl＆GT;\r
    ＆LT;表格名称=placeThisFormID =placeThisNOVALIDATE NG-提交=submitForm（）;＆GT;\r
      ＆LT;标签＆gt;目标＆LT; /标签＆gt;\r
      ＆LT;输入类型=文本NG模型=placeThis.target/＆GT;\r
      ＆LT;标签＆gt;名称和LT; /标签＆gt;\r
      ＆LT;输入类型=文本NG模型=placeThis.name/＆GT;\r
    ＆LT; /表及GT;\r
  ＆LT; / DIV＆GT;\r
＆LT; / DIV＆GT;

\r

\r

\r

I have a form:

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

And i want to add default value to placeThis.target from my controller, like this:

$scope.placeThis = { target: 0 }

But it isn't working if im not adding $scope.$apply or wrapping it inside $timeout (which will run $scope.$apply for me) .

I can save other $scope values from the controller without any problem, but values inside forms most be written inside $timeout or they get lost on submit. Why is this happening?

解决方案

Please see demo below

You need to change name of your form from 'placeThis' to something else like 'placeThisForm' otherwise you overwriting $scope.placeThis values set in your controller.

Please see demo below

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>

这篇关于为什么里面填充NG形式的模式应遵循$范围。$申请？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！