AngularJS动态⽣成div的ID 1、问题背景
给定⼀个数组对象，⾥⾯是div的id；循环⽣成div元素，并给id赋值
2、实现源码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AngularJS动态⽣成div的ID</title>
<script src="apps.bdimg/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
var app = dule("idApp",[]);
$scope.divIds = [
{divId:"chartId1"},
{divId:"chartId2"},
{divId:"chartId3"},
{divId:"chartId4"},
{divId:"chartId5"}
];
});
</script>
</head>
<body ng-app="idApp" ng-controller="idCon">
<div ng-repeat="chart in divIds">
<div id="{{chart.divId}}">{{chart.divId}}</div>
</div>
</body>
</html>
3、实现结果
<html><head><style type="text/css">@charset "UTF-8";[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide:not(.ng-hide-anima  <meta charset="UTF-8">
<title>angularJS动态⽣成div的ID</title>
<script src="apps.bdimg/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
var app = dule("idApp",[]);
$scope.divIds = [
{divId:"chartId1"},
{divId:"chartId2"},
{divId:"chartId3"},
{divId:"chartId4"},
{divId:"chartId5"}
];
});
</script>
</head>
<body ng-controller="idCon" ng-app="idApp" class="ng-scope">
<!-- ngRepeat: chart in divIds --><div ng-repeat="chart in divIds" class="ng-scope">
<div id="chartId1" class="ng-binding">chartId1</div>
</div><!-- end ngRepeat: chart in divIds --><div ng-repeat="chart in divIds" class="ng-scope">
<div id="chartId2" class="ng-binding">chartId2</div>
</div><!-- end ngRepeat: chart in divIds --><div ng-repeat="chart in divIds" class="ng-scope">
angular和angularjs<div id="chartId3" class="ng-binding">chartId3</div>
</div><!-- end ngRepeat: chart in divIds --><div ng-repeat="chart in divIds" class="ng-scope">
<div id="chartId4" class="ng-binding">chartId4</div>
</div><!-- end ngRepeat: chart in divIds --><div ng-repeat="chart in divIds" class="ng-scope">
<div id="chartId5" class="ng-binding">chartId5</div>
</div><!-- end ngRepeat: chart in divIds -->
</body></html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。