Fatal编程技术网
  • angularjs/
  • AngularJS-如果输入被取消公告，我如何立即知道它何时被更改？

AngularJS-如果输入被取消公告，我如何立即知道它何时被更改？

angularjs input

AngularJS-如果输入被取消公告，我如何立即知道它何时被更改？,angularjs,input,angularjs-ng-model,angularjs-ng-change,Angularjs,Input,Angularjs Ng Model,Angularjs Ng Change,有了文本输入，我想知道用户何时更改文本，但我也想使用去盎司功能。例如，通过这种方式，我可以在用户更改文本时禁用提交按钮，并在取消公告功能中检查文本后启用提交按钮 有没有办法用纯AngularJS做到这一点？还是应该使用javascript/jquery 使用此代码，我只能知道用户在解盎司500毫秒延迟后何时更改了文本： <!doctype html> <html ng-app="app"> <head> <script src="

有了文本输入，我想知道用户何时更改文本，但我也想使用去盎司功能。例如，通过这种方式，我可以在用户更改文本时禁用提交按钮，并在取消公告功能中检查文本后启用提交按钮

有没有办法用纯AngularJS做到这一点？还是应该使用javascript/jquery

使用此代码，我只能知道用户在解盎司500毫秒延迟后何时更改了文本：

<!doctype html>
<html ng-app="app">
    <head>
        <script src="http://localhost/js/angular.min.js"></script>
        <script>
            var app= angular.module('app',[]);

            app.controller('ExampleController',['$scope',function($scope){
                $scope.changed= '';
                $scope.change= function(){
                    $scope.changed= 'Changed!';
                };
            }]);
        </script>
    </head>
    <body ng-controller="ExampleController">
        <div>Message: <input type="text" ng-model="model.message"
            ng-model-options="{debounce:500}" ng-change="change()" />

        <div>{{model.message}}</div>
        <div>{{changed}}</div>
    </body>
</html>


var-app=angular.module（'app'，[]）；
app.controller（'ExampleController'，['$scope'，function$scope）{
$scope.changed=''；
$scope.change=function（）{
$scope.changed='changed！'；
};
}]);
信息：
{{model.message}
{{changed}}
您的主要选择是使用
ng keyup
编写自己的去抖动代码。每次按下一个键，您都会收到更改通知（并且更改将出现在
ng型号
值中），您可以在那里使用自己的
setTimeout
，并使用所需的去盎司功能作为回调。如果已经设置了超时，只需取消并在每次按键时重新启动即可

您的主要选择是使用
ng keyup
编写自己的去抖动代码。每次按下一个键，您都会收到更改通知（并且更改将出现在
ng型号
值中），您可以在那里使用自己的
setTimeout
，并使用所需的去盎司功能作为回调。如果已经设置了超时，只需取消并在每次按键时重新启动即可

使用
$scope.$watch（'model-name'，function（）{…}
使用
$scope.$watch（'model-name'，function（）{…}

angular.module('customControl').
directive('contenteditable', [function() {
return {
    restrict: 'A', // only activate on element attribute
    require: '?ngModel', // get a hold of NgModelController
    link: function(scope, element, attrs, ngModel) {
        if (!ngModel) return; // do nothing if no ng-model        
        ngModel.$parsers.push(function(value) {
            // do what you want to happen before "debounce"
            // debounce here by waiting 500ms
        });
    }
};
}]);
资料来源：

来源：

无法以简单的方式完成此操作，我已经在angular with Underline库之外完成了此操作。这是我找到的最佳选择

这是我的密码：

<!doctype html>
<html ng-app="app">
    <head>
        <script src="http://localhost/js/angular.min.js"></script>
        <script src="http://localhost/js/underscore.js"></script>
        <script>
            var underscore= angular.module('underscore',[]);

            underscore.factory('_',function(){
                return window._; // assumes underscore has already been loaded on the page
            });

            var app= angular.module('app',['underscore']);

            app.controller('ExampleController',['$scope','_',function($scope,_){
                $scope.changed= '';

                $scope.change= function(){
                    $scope.debounceMessage($scope);
                };

                $scope.debounceMessage= _.debounce(function($scope){
                    $scope.$apply(function(){
                        $scope.changed= 'Delayed: '+$scope.model.message;
                    });
                }, 500);

            }]);
        </script>
    </head>
    <body ng-controller="ExampleController">
        <div>Message: <input type="text" ng-model="model.message"
            ng-change="change()" />

        <div>{{model.message}}</div>
        <div>{{changed}}</div>
    </body>
</html>


var下划线=angular.module（'下划线'，[]）；
下划线.工厂（“”），函数（）{
返回窗口。；//假定页上已加载下划线
});
var app=angular.module（'app'，['下划线']）；
app.controller（'ExampleController'，['$scope'，''函数（$scope，''）{
$scope.changed=''；
$scope.change=function（）{
$scope.debounceMessage（$scope）；
};
$scope.debounceMessage=u.debounce（函数（$scope）{
$scope.$apply（函数（）{
$scope.changed='Delayed:'+$scope.model.message；
});
}, 500);
}]);
信息：
{{model.message}
{{changed}}
由于无法以简单的方式完成此操作，我在angular with Underline库之外完成了此操作。这是我找到的最佳选择

这是我的密码：

<!doctype html>
<html ng-app="app">
    <head>
        <script src="http://localhost/js/angular.min.js"></script>
        <script src="http://localhost/js/underscore.js"></script>
        <script>
            var underscore= angular.module('underscore',[]);

            underscore.factory('_',function(){
                return window._; // assumes underscore has already been loaded on the page
            });

            var app= angular.module('app',['underscore']);

            app.controller('ExampleController',['$scope','_',function($scope,_){
                $scope.changed= '';

                $scope.change= function(){
                    $scope.debounceMessage($scope);
                };

                $scope.debounceMessage= _.debounce(function($scope){
                    $scope.$apply(function(){
                        $scope.changed= 'Delayed: '+$scope.model.message;
                    });
                }, 500);

            }]);
        </script>
    </head>
    <body ng-controller="ExampleController">
        <div>Message: <input type="text" ng-model="model.message"
            ng-change="change()" />

        <div>{{model.message}}</div>
        <div>{{changed}}</div>
    </body>
</html>


var下划线=angular.module（'下划线'，[]）；
下划线.工厂（“”），函数（）{
返回窗口。；//假定页上已加载下划线
});
var app=angular.module（'app'，['下划线']）；
app.controller（'ExampleController'，['$scope'，''函数（$scope，''）{
$scope.changed=''；
$scope.change=function（）{
$scope.debounceMessage（$scope）；
};
$scope.debounceMessage=u.debounce（函数（$scope）{
$scope.$apply（函数（）{
$scope.changed='Delayed:'+$scope.model.message；
});
}, 500);
}]);
信息：
{{model.message}
{{changed}}

你说的去抖动是什么意思？@ramamoorthy_villi此选项会在用户交互和模型更新之间造成延迟。去抖动500毫秒是非常极端的，我想，通常我会期望大约250毫秒，500毫秒似乎什么都不起作用-可能会导致用户体验不和谐？@callum linington这只是一个例子。对于我所说的e没有办法按照我的要求去做，所以我会做相反的事情；不要在每次更改时去抖动并调用我自己的去抖动函数。我会尝试使用下划线库的去抖动。去抖动是什么意思？@ramamoorthy_villi此选项会在用户交互和模型更新之间造成延迟。去抖动500毫秒是非常极端的ink，通常我会期望大约250ms，500似乎什么都不起作用-可能会造成不和谐的用户体验？@callum linington这只是一个例子。对于我所看到的，没有办法做到我所要求的，所以我会做相反的事；不要在每次更改时取消Bounce并调用我自己的取消Bounce函数。我将尝试使用下划线库的取消Bounce。