NG-展示和NG-变化不必要的延迟 [英] ng-show and ng-change unwanted delay

问题描述

我是新与angularjs和火力点。我试图做一个表单，用户输入用户名。每次的＆LT;输入＆GT; 改变我检查，如果用户名已被占用或免费。如果用户名已被占用我想显示＆LT; P＆GT; ，说：用户名已被占用

I'm new with angularjs and firebase. I'm trying to make a form where the user insert the username. Everytime that the <input> changes I check if the username is already taken or is free. If the username is already taken I want to show a <p> that says "The username is already taken".

问题是这样的：如果我插入一个用户名已被使用（例如，达米亚诺的）控制台说：用户名是不正常，但＆LT; p＆GT; 与NG-表演段落不会出现。但是，如果我加一个字母的用户名（如 Damianox 的）控制台说：用户名就可以了，而＆LT; P＆GT; 段出现！但musn't出现，因为用户名Damianox是免费的！

The problem is this: if I insert a username already taken (for example "Damiano") the console says "the username is not ok" but the <p> paragraph with ng-show doesn't appear. But if I add a single letter to the username (for example "Damianox") the console says "the username is ok" and the <p> paragraph appears! But it musn't appear because the username "Damianox" is free!

似乎有一个信的延迟！

It seems that there's a delay of a letter!

这是code和遗憾的英语不好！

This is the code and sorry for the bad english!

这是fistime.html

This is fistime.html

<!-- Text input-->
<div class="form-group">
  <label class="col-md-4 control-label" for="txtTitle">Username</label>  
  <div class="col-md-4">
    <input type="text" id="txtUsername" ng-model="user.username" ng-change="verifyuser();"  placeholder="Be imaginative" class="form-control input-md">
    <p ng-show="invalidUsername"> The username is already taken</p>
  </div>
</div>

这是firstime.js

and this is firstime.js

.controller('FirstimeCtrl', ['$scope', '$firebase','$location', 'CommonProp', function($scope, $firebase, $location ,CommonProp) {

    $scope.verifyuser = function(){

                //var invalidName = $scope.invalidUsername;
                var newUsername = $scope.user.username;
                var msg = $scope.invalidMsg;

                var ref = new Firebase("https://instafame.firebaseio.com");
                var q = ref.child("users").orderByChild("username").equalTo(newUsername);     

                    q.once("value", function(snapshot){
                        if (snapshot.val() === null){
                            $scope.invalidUsername = false;
                            console.log("the username is ok")
                        }else{
                            $scope.invalidUsername = true;
                            console.log("the username is not ok")

                        }

                    })}

在事先＆LT感谢; 3。

Thanks in advance <3

推荐答案

这里的问题是该变化 invalidUsername 不会触发一个新的圈子消化的案例。

The problem here is a that the change of invalidUsername doesn't trigger a new digest circle in your case.

您可以通过使用 $超时解决此问题。
当你注入 $超时你可以改变你的code（1简化你如果在这里/其他情况下）：

You could workaround this problem by using a $timeout. After you injected $timeout you can change your code (i simplified your if/else case here):

q.once("value", function(snapshot){
     $timeout(function(){
          $scope.invalidUsername = snapshot.val() === null;
     });
})}

这篇关于NG-展示和NG-变化不必要的延迟的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！