我在尝试使用Angular *ngFor
和*ngIf
同一个元素时遇到了问题.
当尝试遍历集合中的集合时*ngFor
,集合被视为null
并因此在尝试访问模板中的属性时失败.
@Component({
selector: 'shell',
template: `
<h3>Shell</h3><button (click)="toggle()">Toggle!</button>
<div *ngIf="show" *ngFor="let thing of stuff">
{{log(thing)}}
<span>{{thing.name}}</span>
</div>
`
})
export class ShellComponent implements OnInit {
public stuff:any[] = [];
public show:boolean = false;
constructor() {}
ngOnInit() {
this.stuff = [
{ name: 'abc', id: 1 },
{ name: 'huo', id: 2 },
{ name: 'bar', id: 3 },
{ name: 'foo', id: 4 },
{ name: 'thing', id: 5 },
{ …
Run Code Online (Sandbox Code Playgroud) 我正在循环一组模型,并希望每个模型显示一个元素.但是,出于CSS的原因,我必须在到达第四个模型时添加另一个元素(我需要clearfix
为布局添加一个Bootstrap 元素才能看起来很好).
<div class="jumbotron">
<ol class="row">
<li *ngFor="#card of deck; #i = index" class="col-xs-3">
<h3>{{ card.name }}</h3>
</li>
</ol>
</div>
Run Code Online (Sandbox Code Playgroud)
怎么说,如果(i + 1) % 4 === 0
,然后li
加上另一个<li class="clearfix"></li>
?