如何使用* ngFor实现角度网格系统

时间:2018-06-09 18:25:49

标签: html angular angular5 ngfor

如何使用ngFor

在Angular5中实现下面提到的结果

假设我在Angular5组件中定义了一个数组。如何显示如下给出的数组。

<div class='row'>
 <div class='col-3'>1</div>
<div class='col-3'>2</div>
<div class='col-3'>3</div>
<div class='col-3'>4</div>
</div>
<div class='row'>
 <div class='col-3'>5</div>
<div class='col-3'>6</div>
<div class='col-3'>7</div>
<div class='col-3'>8</div>
</div>
<div class='row'>
 <div class='col-3'>9</div>
<div class='col-3'>10</div>
<div class='col-3'>11</div>
<div class='col-3'>12</div>
</div>

我想使用angular5 ngFor。假设值来自rest api。对不起语法。

1 个答案:

答案 0 :(得分:0)

<ng-container let obj of objs><div class='row'>
 <div class='col-3'>{{obj.i}}</div>
<div class='col-3'>{{obj.i}}</div>
<div class='col-3'>{{obj.i}}</div>
<div class='col-3'>{{obj.i}}</div>
</div></ng-container>