Question

我已经在角度js中创建了一个应用程序，其中我从工厂获取了一个json，然后在两个控制器 Ctrl1 和 Ctrl2中获取它即可。代码工作正常，但在结构中我取消并保存按钮，当我取消时，我需要重做以前保存的更改，当我点击保存时，它应该更新json。

但由于angular是双向绑定，因此即使在单击“保存”按钮

之前，该值也会发生变化

我的代码如下所示

HTML

<div ng-app="app">
    <div ng-controller="Ctrl1">
        <form>
            <br></br>{{user}}</form>
    </div>
    <div ng-controller="Ctrl2">
        <input type="text" ng-model="user.name" /><br>
        <input type="button" ng-click="save()" value="Save" />
        <input type="button" ng-click="cancel()" value="Cancel" />
    </div>
</div>

脚本

var app = angular.module("app", []);
app.factory('InitApp', function () {
    return {
        name: 'Manu',
        age: 15
    };
});
app.controller('Ctrl1', function ($scope, InitApp) {
    $scope.user = InitApp;
});

app.controller('Ctrl2', function ($scope, InitApp) {
    $scope.user = InitApp;
    $scope.save = function () {

    }
    $scope.cancel = function () {}
});

Answer 1

我猜测在保存之前不会改变值。您要做的是复制控制器中的对象并操作/保存副本。

app.controller('Ctrl1', function ($scope, InitApp) {
    $scope.user = angular.copy(InitApp);
});

这会断开控制器对象与服务对象的连接，从而为您提供服务中的一个事实来源。取消只能重新绑定到服务对象。

此外，在您的小提琴中，您将返回属性并操纵控制器中的服务。您需要返回一个对象，这样您就不会直接操作该服务并将其破坏。

http://jsfiddle.net/bfelda/8btk5/45/

Answer 2

如果您有兴趣回滚原始值，以防用户点击Cancel按钮，您应该拥有从服务中检索到的模型的副本，并绑定到副本。

如果用户点击Cancel，您应丢弃此副本并使用原始对象重新初始化所有值。保存对象需要相应地更新模型等。

Answer 3

我不确定我是否按照你的问题，但也许这会有所帮助...

Angular中的模型绑定仅将值保存到控制器而不是工厂。

如果您希望更新工厂中的值，则需要在save方法中执行此操作（通过调用工厂服务内部的方法）。

值在保存角度js之前发生变化

3 个答案: