为什么在 $scope 执行 AngularJS 时表单没有更新

Question

所以我有一个表单，当我加载表单时，我会用它调用一个函数。该函数用一些数据填充表单。

$scope.fill = function {

                            $scope.formData.name = 'Sara';
                            console.log($scope.formData.name);

                        })

在索引视图上我有以下内容：

<div class="form-group">                
<input type="text" class="form-control" name="name" ng-model="formData.name"></div>

所以当我按下按钮时：

<button ng-controller="formController" ui-sref="front.form.profile" ng-click="fill()">Fill</button>

我希望用我定义的值填写有关名称的表单。

我遇到的问题是 $scope 已更新，在 console.log 上我得到了名称 sara 但表单仍然为空且未更新>

我在函数末尾添加了 $scope.apply() 但它没有做任何改变。 请帮忙

Answer 1

ng-controller="formController" ui-sref="front.form.profile" ng-click="fill()"

您还创建了子控制器，$scope 也是子范围，因此如果您更改子范围的值，则父范围的“$scope.formData.name”的值不会改变。

您可以通过指令使用双向绑定。 参考资料：https://docs.angularjs.org/guide/directive

希望对你有帮助！

Answer 2

您的按钮有自己的控制器：

<button ng-controller="formController"

这只会为按钮创建一个子范围。去掉它。您还应该创建 ui-sref 属性，因为您不需要按钮来填充表单，而不是导航到另一个状态。