Angularjs 将动态字符串放入ng类

我有一些代码可以读取JSON数据，这些数据用于呈现自定义表单。呈现文本输入时，我希望向控件添加验证。这很简单，但是我在找到从动态信息中呈现验证HTML的正确方法时遇到了一些问题

这比解释更容易说明。这是我的代码，您可以看到我正在使用自定义数据呈现属性。（例如{fl.fldBasic.fldLabel}}）

此字段为必填字段

运行此操作时，web浏览器将呈现以下内容：

> <div ng-class="{ 'has-error' : editForm.Label002.$invalid &amp;&amp;
> !editForm.Label002.$pristine }" class="ng-scope">
>     <input type="text" class="form-control ng-pristine ng-valid ng-not-empty ng-valid-required ng-touched" id="Label002" tabindex="1"
> ng-model="fl.dataValue" ng-required="true" ng-readonly="false"
> ui-mask="" title="This field contains the last name of the cardholder.
> It can be up to 40 characters long." placeholder=""
> required="required" autofocus="">
>     <!-- ngIf: editForm.{{fl.fldBasic.fldLabel}}.$touched --> </div>

>
>ng model=“fl.dataValue”ng required=“true”ng readonly=“false”
>ui mask=”“title=“此字段包含持卡人的姓氏。
>最多可包含40个字符。“占位符=“”
>required=“required”自动对焦=”“>
>      

如果您查看，您将看到ng类语句的符号被呈现为&；'s、 底部的ng if逐字呈现数据值

我一直在尝试用引号来包装东西，但我就是找不到让一切都起作用的神奇组合。你有什么想法可以让这一切顺利进行吗

---

谢谢

尝试改用函数。在控制器中声明一个函数，该函数将生成动态字符串，并将该函数用于

ng类

。 这应该行得通

<div ng-class="{ 'has-error' : myHasErrorFunc(editForm, fl.fldBasic.fldLabel)}">

---

然后您应该在您的作用域中声明函数

myhaserrofunc

。

此示例适用于我：

<div class="form-group" ng-class="{ 'has-error' : adForm.adName.$invalid && !adForm.adName.$pristine }">
    <label class="col-sm-3 control-label">{{ 'ad_title' | translate }}</label>
    <div class="col-sm-5">
        <input type="text" class="form-control" id="adName" name="adName" ng-model="ad.name" required ng-pattern="/^[a-zA-Z0-9_\-\.\!\s]+$/" ng-maxlength="128" />
        <p ng-show="adForm.adName.$error.required && !adForm.adName.$pristine" class="help-block">{{ 'ad_title' | translate }} {{ 'isRequired' | translate }}</p>
        <p ng-show="adForm.adName.$error.maxlength && !adForm.adName.$pristine" class="help-block">{{ 'error.validation.mustBeLessThan' | translate}} 128 {{ 'error.validation.charactersLong' | translate}}</p>
        <p ng-show="adForm.adName.$invalid && !adForm.adName.$pristine" class="help-block">{{ 'Invalid' | translate }} {{ 'ad_title' | translate }} {{ 'error.validation.title' | translate}}</p>
    </div>
    <div class="form-group-required"></div>
</div>

{{'ad_title'| translate}}
{{{'ad_title'| translate}}{{{'isRequired'| translate}
{{error.validation.mustbelesson'| translate}}128{{{error.validation.charactersLong'|translate}
{{{{invalid'| translate}}{{{'ad_title'| translate}{{{'error.validation.title'| translate}}

我正在使用引导，我使用不同的

HTML标记，根据错误情况显示页面中的错误消息：

• 最大长度
• 必需的
• 无效（正则表达式）

<div class="form-group" ng-class="{ 'has-error' : adForm.adName.$invalid && !adForm.adName.$pristine }">
    <label class="col-sm-3 control-label">{{ 'ad_title' | translate }}</label>
    <div class="col-sm-5">
        <input type="text" class="form-control" id="adName" name="adName" ng-model="ad.name" required ng-pattern="/^[a-zA-Z0-9_\-\.\!\s]+$/" ng-maxlength="128" />
        <p ng-show="adForm.adName.$error.required && !adForm.adName.$pristine" class="help-block">{{ 'ad_title' | translate }} {{ 'isRequired' | translate }}</p>
        <p ng-show="adForm.adName.$error.maxlength && !adForm.adName.$pristine" class="help-block">{{ 'error.validation.mustBeLessThan' | translate}} 128 {{ 'error.validation.charactersLong' | translate}}</p>
        <p ng-show="adForm.adName.$invalid && !adForm.adName.$pristine" class="help-block">{{ 'Invalid' | translate }} {{ 'ad_title' | translate }} {{ 'error.validation.title' | translate}}</p>
    </div>
    <div class="form-group-required"></div>
</div>