尝试了我能猜出的每一种语法都无法使其有效!
<!--- THIS WORKS FINE --->
<ion-card *ngFor="#post of posts">
{{post|json}}
</ion-card>
<!--- BLANK PAGE --->
<ion-card *ngFor="#post of posts track by post.id">
{{post|json}}
</ion-card>
<!--- Exception : Cannot read property 'id' of undefined --->
<ion-card *ngFor="#post of posts;trackBy:post.id">
{{post|json}}
</ion-card>
<!--- Exception : Cannot read property 'undefined' of undefined --->
<ion-card *ngFor="#post of posts;trackBy:posts[index].id">
{{post|json}}
</ion-card>
<!--- Blank page no exception raised ! --->
<ion-card *ngFor="#post of posts;#index index;trackBy:posts[index].id">
{{post|json}}
</ion-card>
Run Code Online (Sandbox Code Playgroud)
对我有用的唯一方法是
在控制器类中创建方法
识别(索引,帖子:帖子){return post.id}
和
<ion-card *ngFor="#post of …Run Code Online (Sandbox Code Playgroud) 我有一个元素数组,用户不仅可以编辑,还可以添加和删除完整的数组元素。除非我尝试在数组的开头添加一个值(例如使用unshift),否则此方法效果很好。
这是证明我的问题的测试:
import { Component } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormsModule } from '@angular/forms';
@Component({
template: `
<form>
<div *ngFor="let item of values; let index = index">
<input [name]="'elem' + index" [(ngModel)]="item.value">
</div>
</form>`
})
class TestComponent {
values: {value: string}[] = [{value: 'a'}, {value: 'b'}];
}
fdescribe('ngFor/Model', () => {
let component: TestComponent;
let fixture: ComponentFixture<TestComponent>;
let element: HTMLDivElement;
beforeEach(async () => {
TestBed.configureTestingModule({
imports: [FormsModule],
declarations: [TestComponent]
});
fixture …Run Code Online (Sandbox Code Playgroud) 我认为这是我的实现的问题,但从我提出的这个问题来看,我用于创建动态 FormArray 的代码似乎应该是功能性的。当我将它集成到我的项目中时,删除函数确实从 FormArray 中删除了元素,但它不会反映在界面中/不会从 DOM 中删除对象。可能是什么原因造成的?
import {
Component,
VERSION
} from '@angular/core';
import {
FormGroup,
FormControl,
FormArray,
Validators,
FormBuilder
} from '@angular/forms';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
objectProps: any[];
public dataObject = [{
"label": "Name",
"name": "name",
"type": "text",
"data": ""
},
{
"label": "Contacts",
"name": "contacts",
"type": "inputarray",
"array": []
}
]
form: FormGroup;
constructor(private _fb: FormBuilder) {}
ngOnInit() {
const formGroup = {};
for (let field of …Run Code Online (Sandbox Code Playgroud)