Question

HTML：

<div ng-controller="MyController">
<form>
<!-- one way to do it -->
<input ng-model="var1" value="1"></input> 
<!-- another way, not approved per angular documentation outside of ngRepeat -->
<input ng-model="var2" ng-init="var2=2"></input>
</form>
</div>

JS：

angular.module('myApp', []);
angular.module('myApp')
    .controller('MyController', ['$scope', function ($scope) {
  console.log("value of var1 is " + $scope.var1);
  console.log("value of var2 is " + $scope.var2);
  $scope.var1 = 3;
  $scope.var2 = 4;
}]);

View this in jsbin

结果：

value of var1 is undefined
value of var2 is undefined
[setting values to 3 and 4 displays fine in inputs]

因此，在评估输入ng-model参数之前，似乎控制器代码正在运行。鉴于控制器早于输入标签公布，这是有道理的。

问题：

有没有办法让控制器逻辑读取并尊重var1和var2的初始值？

Answer 1

您无法混合使用Angular ng-model和常规HTML value属性。

如果要初始化模型，请在控制器中执行（或使用ng-init，但不建议使用此模型）。并从HTML中删除value。

$scope.var1 = 3;
$scope.var2 = 4;

此外，ng-init在首次阅读控制器后进行评估，因此如果您想显示ng-init所需的$watch值：它不会出现在那里第一次执行控制器。

我可以在html中初始化Angular ngModel，然后在控制器中使用它的值吗？

1 个答案: