【问题标题】:AngularJS $scope.form.$submitted shows trueAngularJS $scope.form.$submitted 显示为真
【发布时间】:2016-10-15 09:07:18
【问题描述】:

我有一个多步骤表单,我想控制用户是否在每个步骤中提交了有效信息。我正在检查验证,如果为真,我将进入下一步,但 $scope.form.$submitted 显示为真,并且弹出 ng-message。

function stepForward(step){
            console.log($scope.AdvertiserRegistration.$valid);
            if($scope.AdvertiserRegistration.$valid){
                var t = setTimeout(function(){
                    $scope.AdvertiserRegistration.$submitted = false;
                },3000);
                window.location = '#/advertiser/register/step'+step;
            }

        }

所以这是我的功能,但它不起作用:

console.log($scope.AdvertiserRegistration.$valid) 返回 True。

有什么办法吗?

【问题讨论】:

  • 你想用这个 $scope.AdvertiserRegistration.$submitted = false 达到什么目的?
  • 您确实意识到您的 window.location 将立即发生,但 $submitted 只会在 3 秒后更新(我假设您正在模拟 3 秒的服务器回发?)。
  • 所以@wdanda 在这种情况下你有什么建议?
  • 取决于您要执行的操作。您是否尝试在服务器端验证每个步骤以查看用户是否输入了有效数据?如果是这种情况,我不会立即将用户发送到下一步,我会呼叫服务器(并显示“请稍候”消息),一旦呼叫解决,您可以显示错误消息或者如果成功(即用户数据有效),然后才重定向到下一步。
  • @wdanda 不,我没有验证此服务器端。我想要的是一个更简单的解决方案,没有: var t = setTimeout(function(){ $scope.AdvertiserRegistration.$submitted = false; },3000);仅适用于:$scope.AdvertiserRegistration.$submitted = false;因为你说 window.location = '#/advertiser/register/step'+step;在这里麻烦。那么我该如何替换 window.location = '#/advertiser/register/step'+step;在这种情况下与 ui-router 一起工作?

标签: javascript jquery angularjs forms


【解决方案1】:

使用 Angular 时,任何异步操作都会将您带出 Angular 摘要循环,因此 Angular 团队为这些操作提供服务,其中之一是 $timeout,请将您的代码更改为:

function stepForward(step){
            console.log($scope.AdvertiserRegistration.$valid);
            if($scope.AdvertiserRegistration.$valid){
                //YOU NEED TO INJECT $timeout
                var t = $timeout(function(){
                    $scope.AdvertiserRegistration.$submitted = false;
                },3000);
                window.location = '#/advertiser/register/step'+step;
            }

        }

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-09-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-01-05
    • 2018-01-18
    • 1970-01-01
    相关资源
    最近更新 更多