在Angular中,ngForOf指令可以循环遍历一个数组或对象并渲染相应的模板。在每个循环中,Angular会绑定一个本地变量$implicit来表示当前的循环项。
例如,如果我们有一个人员名单的数组,我们可以通过以下方式展示每个人的名字:
-
{{ i + 1 }}. {{ person.name }}
在上述代码中,我们使用了*ngFor指令来循环遍历people数组,并使用$implicit变量绑定当前的循环项person。因此,我们可以在模板内直接使用person属性来访问每个人的名字。
Angular也允许我们自定义本地变量的名称,可以使用as关键字来指定。例如:
-
{{ idx + 1 }}. {{ myPerson.name }} is even: {{ isEven }}, is odd: {{ isOdd }}
在上述代码中,我们为本地变量定义了一些自定义名称,如idx、isEven、isOdd和myPerson。这些变量都可以在模板内通过相应的名称来访问。
需要注意的是,如果我们在*ngFor中定义了多个本地变量,需要使用分号进行分隔。另外,我们也可以使用trackBy选项来帮助Angular更好地跟踪每个循环项的变化,从而提高性能。