AngularJS-获取字段的标签文本 问题:

AngularJS-获取字段的标签文本 问题:,angularjs,forms,angularjs-scope,labels,Angularjs,Forms,Angularjs Scope,Labels,我想知道AngularJS获取字段标签的“最佳实践”方法是什么。使用jQuery,您只需使用“label for”查询进行查询,然后提取文本。虽然可以用AngularJS这样做,但感觉有些不对劲 假设您的HTML中有如下内容: <form name="MyForm" ng-controller="Ctrl"> <label for="MyField">My spoon is too big:</label> <input type="te

我想知道AngularJS获取字段标签的“最佳实践”方法是什么。使用jQuery,您只需使用“label for”查询进行查询,然后提取文本。虽然可以用AngularJS这样做,但感觉有些不对劲

假设您的HTML中有如下内容:

<form name="MyForm" ng-controller="Ctrl">
    <label for="MyField">My spoon is too big:</label>
    <input type="text" size="40" id="MyField" ng-model="myField" />

    <br /><br />

    You entered {{ myField }} for {{ myField.label }}
</form>
基本上,我想填充
myField。在输出中用“我的勺子太大了”标记

我现在在做什么 我现在所做的就是执行一个查询,该查询提取的数据与jQuery方法类似(
$(“label[for='MyField'])
)。然后,如果那不存在,我只是拉占位符文本。它可以工作,但似乎有点开销

我想要完成的事情 我需要一些自定义表单验证,并希望在消息中包含标签。我只需要拉标签文本,这样我就可以非常一般地编写它,然后就不必担心人们在游戏后期动态切换i18n数据

不停摆弄 根据建议的解决方案:

假设在控制器中有一个范围变量,如

$scope.myField = {};
$scope.myField.label = "Fruit name";
你的模板是

<form name="MyForm" ng-controller="Ctrl">
    <label for="MyField">{{myField.label}}</label>
    <input type="text" size="40" id="MyField" ng-model="myField.value" />
    <br /><br />
    You entered {{ myField.label }} for {{ myField.label }}
</form>

{{myField.label}


您为{{myField.label}输入了{{myField.label}}
通过此字段,标签将动态出现。根据您的要求在输入字段中应用自定义验证


希望我能准确理解您的要求。

您可以将HTML更改为以下内容:

<label for="MyField">{{ myFieldLabel }}</label>
<input type="text" size="40" id="MyField" ng-model="myField" />
$scope.myFieldLabel = 'My spoon is too big:';
之后,您可以同样轻松地获取/设置其值:

if ($scope.myFieldLabel === 'My spoon is too big:') {
    $scope.myFieldLabel = 'New label:';
}
注意,新的AngularJS最佳实践要求在字段引用中始终使用“点”。如果您执行以下操作,它将非常适合这里:

<label for="MyField">{{ myField.label }}</label>
<input type="text" size="40" id="MyField" ng-model="myField.value" />

然后,您可以随时轻松访问
$scope.myField.label
$scope.myField.value

只要将标签文本放入输入
标题中,就可以使用“#”指令。您还可以使用它来确保标签id匹配

<label for="{{myfield_control.id}}">{{myfield_control.title}}</label>
<input type="text" size="40" id="MyField" ng-model="myField" title="My spoon is too big:" #myfield_control >

<br /><br />

You entered {{ myField }} for {{ myfield_control.title }}
{{myfield\u control.title}


您为{{myField_control.title}输入了{{myField}}

myField
是您的ngModel
myfield\u控件
是对输入控件的引用。

我喜欢这样。只要人们使用JS代码进行数据查找,这是一种很好的方法。我想我会写一些静态代码分析规则,寻找人们的硬编码标签,而不是试图太花哨,从DOM.maaaa sppooon iss tooooo big加载数据!哈哈哈,汤匙是这里唯一大的东西吗?笑话除了伟大的代码!
$scope.myField = {
    value: '',
    label: 'My spoon is too big:'
};
<label for="{{myfield_control.id}}">{{myfield_control.title}}</label>
<input type="text" size="40" id="MyField" ng-model="myField" title="My spoon is too big:" #myfield_control >

<br /><br />

You entered {{ myField }} for {{ myfield_control.title }}