提供了一个div类型的HTML元素,如何设置其id属性的值,这是一个范围变量和字符串的连接?
当前回答
您可以简单地执行以下操作
在你的js中
$scope.id = 0;
在模板中
<div id="number-{{$scope.id}}"></div>
它会渲染
<div id="number-0"></div>
没有必要在双花括号内连接。
其他回答
我发现实现这种行为的一个更优雅的方法是:
<div id="{{ 'object-' + myScopeObject.index }}"></div>
对于我的实现,我希望ng-repeat中的每个输入元素都有一个唯一的id来关联标签。因此,对于myScopeObjects中包含的对象数组,可以这样做:
<div ng-repeat="object in myScopeObject">
<input id="{{object.name + 'Checkbox'}}" type="checkbox">
<label for="{{object.name + 'Checkbox'}}">{{object.name}}</label>
</div>
在动态添加这样的内容时,能够动态生成唯一id是非常有用的。
您可以简单地执行以下操作
在你的js中
$scope.id = 0;
在模板中
<div id="number-{{$scope.id}}"></div>
它会渲染
<div id="number-0"></div>
没有必要在双花括号内连接。
如果你使用这个语法:
<div ng-attr-id="{{ 'object-' + myScopeObject.index }}"></div>
Angular会渲染如下内容:
<div ng-id="object-1"></div>
但是这种语法:
<div id="{{ 'object-' + $index }}"></div>
将生成如下内容:
<div id="object-1"></div>
只要<input id="field_name_{{$index}}" />
这个方法对我很有效:
<div id="{{'object-' + $index}}"></div> .
推荐文章
- 我如何在Swift连接字符串?
- src和dist文件夹的作用是什么?
- jQuery UI对话框-缺少关闭图标
- 如何突出显示当前菜单项?
- 如何使用AngularJS获取url参数
- 将RGB转换为白色的RGBA
- 如何将“camelCase”转换为“Camel Case”?
- 我们可以在另一个JS文件中调用用一个JavaScript编写的函数吗?
- 如何使用JavaScript重新加载ReCaptcha ?
- jQuery。由于转义了JSON中的单引号,parseJSON抛出“无效JSON”错误
- 在JavaScript关联数组中动态创建键
- 如何创建一个SQL Server函数“连接”多行从一个子查询到一个单独的分隔字段?
- ReactJS和公共文件夹中的图像
- 在React Native中使用Fetch授权头
- 为什么我的球(物体)没有缩小/消失?