0

我试图找到在文本框中输入的重复值，该值检查 ng-change 上的每个输入值。然后显示消息“sos 编号匹配”。尝试了这个，但仍然按顺序对列表数据进行排序。 结果，到目前为止，我没有成功发送常规消息jsfiddle 。以下是代码。：

html代码：

<form name="settingForm" ng-submit="mangeDeviceSettings()"><div class="form-group"> 
                                 <div data-ng-repeat="i in sosLength track by $index">
                                 <ng-form name="sosNumForm">
                                    <span class="input-icon"> <input type="text" ng-disabled="!showPendingStatus" watch-change="change()"
                                      class="form-control" name="SOSNumber"  ng-minlength="10" ng-maxlength="13" placeholder="SOSNumber{{$index+1}} No." ng-pattern="/^[0-9]+$/"
                                      ng-model="deviceSettings.sos[$index]" ng-change="sosChange($index,this)">
                                      <i class="fa fa-mobile"></i></span>
                                      <span ng-show="IsMatch{{$index}} && sampleSOS && sosNumForm.SOSNumber.$dirty">SOS Number has a match!</span>
                                      <span ng-show="(sosNumForm.SOSNumber.$error.minlength || sosNumForm.SOSNumber.$error.maxlength) && sosNumForm.SOSNumber.$dirty">Mobile Number must be between 10 and 13 digits </span>
                                      <span ng-show="!sosNumForm.SOSNumber.$error.minlength && !sosNumForm.SOSNumber.$error.maxlength && sosNumForm.SOSNumber.$error.pattern && sosNumForm.SOSNumber.$dirty">Number must contain only numbers</span>
                                  </ng-form>
                                </div>
                              </div>
                          </div></form>

ng-change 方法：

$scope.sosChange=function(idx, obj){
    $scope.sampleSOS = true;
    $scope.fnfDuplicate=true; 
    obj.$parent.settingForm.$valid = obj.sosNumForm.$valid;
    // console.log(obj.$parent.settingForm.$valid); 
    // console.log(obj.sosNumForm.$valid);
    console.log($scope.deviceSettings.sos[idx]);
    console.log($scope.deviceSettings.sos[i] );
    // console.log(obj.sosNumForm.$valid);
    //  console.log($scope.deviceSettings.sos[idx]!="");
    for (var i = 0; i < 3; i++) {
        if(idx != i ){
            if ($scope.deviceSettings.sos[idx] == $scope.deviceSettings.sos[i] 
                && obj.sosNumForm.$valid && $scope.deviceSettings.sos[idx]!="") {                    
                if(idx==0){
                    $scope.IsMatch0=true;  $scope.sosDuplicate=true;               
                    return false;
                }
                if(idx==1){
                    $scope.IsMatch1=true;  $scope.sosDuplicate=true;               
                    return false;
                }
                if(idx==2){
                    $scope.IsMatch2=true;  $scope.sosDuplicate=true;               
                    return false;
                }                    
            }
            else{
                if(idx==0){
                    $scope.IsMatch0=false;  $scope.sosDuplicate=false;
                    return false;
                }
                if(idx==1){
                    $scope.IsMatch1=false;  $scope.sosDuplicate=false;
                    return false;
                }
                if(idx==2){
                    $scope.IsMatch2=false;  $scope.sosDuplicate=false;
                    return false;
                }
            }  
            // $scope.sosDuplicate=true;               
        }                        
    }
}
4

2 回答 2

0

如果我对您的理解正确，您只需要验证两个字段具有相同的值...例如密码和确认密码...我将粘贴一个片段（它的密码和确认密码）但从那里我确定您可以得到你需要的

我也没有看到需要 ngChange 因为这两个项目都在范围内，所以如果它们不相等，您只想进行验证。

<div class="form-group required" ng-class="{ 'has-error' : changePasswordForm.password.$invalid && submitted}">
        <label class="col-md-3 control-label">New Password </label>
        <div class="col-md-8">
            <input class="form-control" name="password" ng-model="user.password" ng-minLength="6" type="password" required>
            <p ng-show="changePasswordForm.password.$error.minlength && submitted" class="help-block">Password must be atleast 6 characters long.</p>
            <p ng-show="changePasswordForm.password.$error.required && !changePasswordForm.password.$error.minlength && submitted" class="help-block">Password is required.</p>
        </div>
    </div>
    <div class="form-group required" ng-class="{ 'has-error' : (changePasswordForm.confPassword.$invalid || user.password!== user.confPassword) && submitted}">
        <label class="col-md-3 control-label">Confirm password </label>
        <div class="col-md-8">
            <input class="form-control" name="confPassword" ng-model="user.confPassword" type="password" required>
            <p ng-show="changePasswordForm.confPassword.$invalid && submitted" class="help-block">This field is required.</p>
            <p ng-show="changePasswordForm.confPassword.$valid && user.password!== user.confPassword && submitted" class="help-block">Passwords must match.</p>
        </div>
    </div>

和提交是提交时检查...不是必需的

所以在这里你看到我们检查两个范围项是否不相等，因此我们显示错误......

在控制器中，您只需要

$scope.onSubmit = function () {
        $scope.submitted = true;
            if ($scope.createProfileForm.createUserForm.$valid && $scope.user.password === $scope.user.confPassword) {
                $scope.submitted = false;

            }
    }
于 2015-05-21T05:57:10.820 回答
0

html代码：

<div class="form-group"> <!-- <div data-ng-repeat="i in sosLength track by $index"> -->
                                 <div data-ng-repeat="i in persons track by $index">
                                 <ng-form name="sosNumForm">
                                    <span class="input-icon"> <input type="text" ng-disabled="!showPendingStatus" watch-change="change()"
                                      class="form-control" name="SOSNumber"  ng-minlength="10" ng-maxlength="13" placeholder="SOSNumber{{$index+1}} No." ng-pattern="/^[0-9]+$/"
                                      ng-model="deviceSettings.sos[$index]" ng-change="sosChange(this,deviceSettings.sos[$index])">
                                      <i class="fa fa-mobile"></i></span>
                                      <!-- <span ng-show="IsMatch{{$index}} && sampleSOS && sosNumForm.SOSNumber.$dirty">SOS Number has a match!</span> -->
                                      <span ng-if="i.isDuplicate"> SOS Number has a match!</span>
                                      <span ng-show="(sosNumForm.SOSNumber.$error.minlength || sosNumForm.SOSNumber.$error.maxlength) && sosNumForm.SOSNumber.$dirty">Mobile Number must be between 10 and 13 digits </span>
                                      <span ng-show="!sosNumForm.SOSNumber.$error.minlength && !sosNumForm.SOSNumber.$error.maxlength && sosNumForm.SOSNumber.$error.pattern && sosNumForm.SOSNumber.$dirty">Number must contain only numbers</span>
                                  </ng-form>
                                </div>
                              </div>

JS代码：

$scope.sosDuplicate=true; 
$scope.fnfDuplicate=true; 

$scope.persons = [{sos:""},{sos:""},{sos:""}];
$scope._persons = [{fnf:""},{fnf:""}];

$scope.fnfValid = true;
$scope.sosValid = true;

$scope.sosChange=function(obj,value){
    var sorted, i;
    var count =0, checker;

    // obj.$parent.settingForm.$valid = obj.sosNumForm.$valid;
    $scope.sosValid = obj.sosNumForm.$valid;
    if(value!="undefined" || value != "")
    {
        for (var i = 0; i < 3; i++) {
            checker = parseInt($scope.deviceSettings.sos[i]);
            $scope.persons[i].sos = checker==NaN ? "" : checker;
        };


        sorted = $scope.persons.concat().sort(function (a, b) {
            if (a.sos > b.sos) return 1;
            if (a.sos < b.sos) return -1;
            return 0;
        });

        for(i = 0; i < $scope.persons.length; i++) {                    
            sorted[i].isDuplicate = ((sorted[i-1] && sorted[i-1].sos == sorted[i].sos) || (sorted[i+1] && sorted[i+1].sos == sorted[i].sos)
                || (sorted[i+2] && sorted[i+2].sos == sorted[i].sos)|| (sorted[i-2] && sorted[i-2].sos == sorted[i].sos));

            if(sorted[i].isDuplicate==true){
                count+=1;
                console.log(count);

            }
            $scope.sosDuplicate= (count>1) ? true : false;

        }

    }
}
于 2015-05-23T05:08:00.987 回答