Angularjs 角度输入值未更改。i、 e oldValue==newValue

Angularjs 角度输入值未更改。i、 e oldValue==newValue,angularjs,angularjs-directive,Angularjs,Angularjs Directive,Angular在修改输入字段时将“ng dirty”类添加到输入字段,而不管newValue==oldValue与否 i、 e.如果输入值为“manohar”,我删除“r”并将其加回去。即使值为“manohar”(原始值),“ng dirty”类仍然存在 是否有方法检查输入值是否已修改(newValue!=oldValue) 提前感谢。ngDirty/ngPristine目标是告诉您用户是否修改了表单,而不管值是多少。所以在你的情况下,这种行为是完全正常的 如果要修改此行为,可以使用model.

Angular在修改输入字段时将“ng dirty”类添加到输入字段,而不管
newValue==oldValue
与否

i、 e.如果输入值为“manohar”,我删除“r”并将其加回去。即使值为“manohar”(原始值),“ng dirty”类仍然存在

是否有方法检查输入值是否已修改(
newValue!=oldValue


提前感谢。

ngDirty
/
ngPristine
目标是告诉您用户是否修改了表单,而不管值是多少。所以在你的情况下,这种行为是完全正常的


如果要修改此行为,可以使用
model.$setPristine()
函数。更多详细信息请参见:

您可能对该项目感兴趣,该项目名为:

它修改$prisitine以执行以下操作:

  • 保存原始值
  • 恢复到原始值,并更改回原始状态
  • 当子控件恢复原始状态时通知父窗体

如果您想根据表单中数据的实际状态(编辑与原始)处理行为,您需要自己跟踪。就像塞蒂亚·赛斯(Cétia sais)一样,dirty/prestine只是为了跟踪交互和验证,而不是状态

这可能有些过分,但我通常会这样做:

.controller('MyController', function ($scope, Restangular) {


    /**
     * @ngdoc property
     * @name  _dataWatcher
     * @private
     * @propertyOf MyController
     *
     * @description
     * Holds the watch stop-method, if the "data-has-changed" watcher is active.
     */
    var _dataWatcher;


    /**
     * @ngdoc property
     * @name data
     * @propertyOf MyController
     *
     * @description Stores "original" and "edit" copy of the data beeing handled by the form.
     */
    $scope.data = {};


    /**
     * @ngdoc property
     * @name data
     * @propertyOf MyController
     *
     * @description Stores state for the view.
     */
    $scope.state = {
        loading: true,
        saving: false,
        hasChanged: false,
        hasBeenSaved: false
    };


    /**
     * @ngdoc method
     * @name _setup
     * @private
     * @methodOf MyController
     *
     * @description Run on controller init.
     */
    function _setup() {
        $scope.reset();
        $scope.state.loading = false;
    };


    /**
     * @ngdoc method
     * @name _startWatcher
     * @private
     * @methodOf MyController
     *
     * @description
     * Setup watcher for changes in data.test. Stop method will be saved to
     * private property _dataWatcher.
     */
    function _startWatcher() {
        _dataWatcher = $scope.$watch('data.edit', function (newValue, oldValue) {
            if (newValue !== oldValue) {
                if (JSON.stringify(newValue) === JSON.stringify($scope.data.original)) {
                    $scope.state.hasChanged = false;

                    // If you want the form to act like its untouched if no changes are found:
                    $scope.nameOfYourForm.$setPristine();
                } else {
                    $scope.state.hasChanged = true;
                }
            }
        }, true);
    }


    /**
     * @ngdoc method
     * @name _stopWatcher
     * @private
     * @methodOf MyController
     *
     * @description
     * Stop watching data.test for changes. This is needed for "reset" and
     * syncing data without triggering data-has-changed loop.
     */
    function _stopWatcher() {
        if (!_dataWatcher) {
            return;
        }
        _dataWatcher();
    }


    /**
     * @ngdoc method
     * @name save
     * @methodOf MyController
     *
     * @description
     * Save data.edit changes to database, Restangular is used in example but you get the idea.
     */
    $scope.save = function () {
        var newData;

        // Set states
        $scope.state.error = false;
        $scope.state.saving = true;

        // Update with new data
        // $scope.entity is a restangularized object from some server
        newData = Restangular.copy($scope.entity);
        newData.name = $scope.data.edit.name;
        newData.status = $scope.data.edit.status;

        // Save to db
        newData.put().then(function (entity) {
            _stopWatcher();

            // Db returns saved data, update restangular object, to update 
            // data in view.
            $scope.entity.name = entity.name;
            $scope.entity.status = entity.status;

            $scope.reset();

            $scope.state.hasBeenSaved = true;
        }, function (error) {
            $scope.state.hasChanged = true;
            $scope.state.error = error.data;
        }).finally(function () {
            $scope.state.saving = false;
        });
    };


    /**
     * @ngdoc method
     * @name reset
     * @methodOf MyController
     *
     * @description
     * Resets the data object to current state of the original source
     * object. Any unsaved changes in data.edit will be overwritten.
     */
    $scope.reset = function () {
        // Stop watcher, if initialized
        _stopWatcher();

        // Save original data (for comparison)
        $scope.data.original = {
            status: $scope.feed.status,
            name: $scope.feed.name
        };

        // Create new copy of editable data
        $scope.data.edit = angular.copy($scope.data.original);

        // Make sure state signals "not changed"
        $scope.state.hasChanged = false;

        // Force form to be prestine
        $scope.nameOfYourForm.$setPristine();

        // Start watching changes
        _startWatcher();
    };


    _setup();
});

谢谢你的快速回复。我可以将原始值保存到变量中,然后在调用PUT api或任何进一步操作之前检查oldValue==newValue。但我想知道我们是否有任何内置指令来执行此操作。要再次使用model.$setPristine(),我需要关注新旧值。如果我们没有内置的指令来执行此操作,那么将oldValue保存到变量中,然后在调用API时进行比较看起来是更好的解决方案,对吗?谢谢你的回复,谢谢你的回复。请看我上面的评论。