NG-展示和NG-变化不必要的延迟 [英] ng-show and ng-change unwanted delay
问题描述
我是新与angularjs和火力点。我试图做一个表单,用户输入用户名。每次的<输入>
改变我检查,如果用户名已被占用或免费。如果用户名已被占用我想显示< P>
,说:用户名已被占用
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屋!