如何按名称获取 AngularJS 元素? [英] How get AngularJS element by name?

问题描述

在我的表单验证中，有一部分是服务器验证.所以我应该从服务器列表中返回包含字段名称和每个字段中包含错误的字符串.我的想法是编写一个通用的代码知识来处理所有字段，而无需事先知道它们，通过使用它们的名称访问它们.这是例如字段:

<div class="form-group" data-ng-class="{ 'has-error' : step1Form.email.$invalid && (!step1Form.email.$pristine || submit) }"><label>电子邮件</label><input type="email" name="email" class="form-control" data-ng-model="user.email" required data-ng-minlength="5" data-ng-maxlength="60"><p data-ng-show="step1Form.email.$error.required && (!step1Form.email.$pristine || 已提交)" class="help-block">required!</p><p data-ng-show="step1Form.email.$error.minlength" class="help-block">太短1</p><p data-ng-show="step1Form.email.$error.maxlength" class="help-block">太长了！</p><p data-ng-show="step1Form.email.$error.email" class="help-block">电子邮件无效！</p><p data-ng-show="step1Form.email.$error.serverError" class="help-block">{{emailServerError}}</p>

如您所见，变量 emailServerError 被保存用于来自服务器验证的错误...我的应用程序中有很多字段，我尝试编写适用于所有字段的通用代码...

所以这是角度代码:

//在所有验证发生后提交表单的函数$scope.submitForm = function() {//检查以确保表单完全有效如果($scope.step1Form.$valid){//现在我们将进入服务器端验证//AJAX 调用......//假设我们得到了这个:var problem = { field: 'email', msg: '这个邮箱已经注册'};//现在我们需要为电子邮件输入设置有效性.var errorVariableName = $parse(problem.field + 'ServerError');//获取错误字符串变量的名称.errorVariableName.assign($scope, problem.msg);//给它赋值console.log($scope.emailServerError);//= '此邮箱已注册'//这里的问题://现在我需要做这样的事情://$scope.step1Form.+ question.field + .$setValidity('serverError', false);//但我不知道如何做到这一点.//我认为我需要通过名称以某种方式获取此元素 ($scope.step1Form. + question.field)，然后在其上使用 setValidity.但我不知道如何..}};

问题在代码内的注释中...

解决方案

你可以试试

$scope.step1Form

然后使用

访问正确的值

$scope.step1Form["nameOfProblemfield"]

In my form validation there is part of server validations. So I should get back from the server list with the names of the fields and a string with the error in each of them. My idea was to write a general code knowledge to deal with all fields without knowing them in advance, by accessing them with their name. this is field for example:

<!-- Email -->
<div class="form-group" data-ng-class="{ 'has-error' : step1Form.email.$invalid && (!step1Form.email.$pristine || submitted) }">
     <label>Email</label>
     <input type="email" name="email" class="form-control" data-ng-model="user.email" required data-ng-minlength="5" data-ng-maxlength="60">
     <p data-ng-show="step1Form.email.$error.required && (!step1Form.email.$pristine || submitted)" class="help-block">required!</p>
     <p data-ng-show="step1Form.email.$error.minlength" class="help-block">too short1</p>
     <p data-ng-show="step1Form.email.$error.maxlength" class="help-block">too long!</p>
     <p data-ng-show="step1Form.email.$error.email" class="help-block">invalid email!</p>
     <p data-ng-show="step1Form.email.$error.serverError" class="help-block">{{emailServerError}}</p>
</div>

like you can see, the variable emailServerError is saved for errors that come from the server validations... i have a lot fields in my application and i try to write generic code that will fit for all the fields...

so this is the angular code:

// function to submit the form after all validation has occurred            
$scope.submitForm = function() {

    // check to make sure the form is completely valid
    if ($scope.step1Form.$valid) {
        // now we will go to server side validation
        // AJAX calls.......
        // lets say we got this back:
        var problem = { field: 'email', msg: 'this email is already registered'};

        // now we need to setValidity for email input.
        var errorVariableName = $parse(problem.field + 'ServerError');  // Get the name of the error string variable.
        errorVariableName.assign($scope, problem.msg);  // Assigns a value to it

        console.log($scope.emailServerError); // = 'this email is already registered'

        // HERE THE PROBLEM:
        // now i need to do something like that:
        // $scope.step1Form. + problem.field + .$setValidity('serverError', false);
        // but i dont know how to this that.

        // i think that i need to get this element ($scope.step1Form. + problem.field) in some way by name, and then use setValidity on it. but i dont know how.. 
    }      
};

the question is in the comments inside the code...

解决方案

You can try

$scope.step1Form

and then access the right value with

$scope.step1Form["nameOfProblemfield"]

这篇关于如何按名称获取 AngularJS 元素?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！