Question

假设我有一些已加载的用户数据。现在，它存储在mainCtrl范围内的“用户”模型中。然后，我想要一个最初使用此用户数据填充的用户更新表单，但仅在表单成功提交后才更新“用户”模型。

我是否完全错了？我遇到了分配引用的困难，因此两个模型（'user'和'updateUser'）无法独立更新。

HTML

<div ng-controller="mainCtrl">
    <form ng-controller="updateCtrl" ng-submit='submit()'>
        <input ng-model='updateUser.firstName'>
        <input ng-model='updateUser.email'>
    </form>
</div>

JS

var userData = {
    'firstName': 'Chris',
    'email': 'test@test.com'
}

app.controller('mainCtrl', ['$scope', '$http',
    function($scope, $http) {
        $scope.user = userData;
    };
]);

app.controller('updateCtrl', ['$scope', '$http',
    function($scope, $http) {
        $scope.updateUser = $scope.user;

        $scope.submit = function () {
        // Submit form to server and on success, update $scope.user
        }
    };
]);

Answer 1

$scope.updateUser = angular.copy($scope.user);

$scope.submit = function () {
    // Submit form to server and on success, update $scope.user
    ..
    ..
    $scope.user = angular.copy($scope.updateUser);
}

Angularjs：范围继承和表单提交

1 个答案: