在Angular 2中，无法找到类型为'leaveType'的不同支持对象'[object Object]'。 NgFor只支持绑定到Iterables，比如数组

我搜索了这个问题并进行了探索并得到了解决方案，但它们并不适合我，我想在打字稿的下拉选项中显示静态数据/列表，我正在使用对象数组leaveType。但是，当我这样做，然后得到这个错误：在Angular 2中，无法找到类型为'leaveType'的不同支持对象'[object Object]'。 NgFor只支持绑定到Iterables，比如数组

原来的例外：无法找到类型'leaveType'不同的支持对象'[object object]'。 NgFor仅支持与阵列等Iterables绑定。

请建议我在哪里做错了。

我的代码是：

团队component.ts

import { Component, OnInit, HostBinding      } from '@angular/core'; 
import { FormGroup, FormBuilder, Validators  } from '@angular/forms'; 
import { IMyOptions, IMyDateModel    } from 'mydatepicker'; 
import { CONSTANT        } from '../../constants/dash-constant'; 
import { TeamService        } from '../../services/team-component.service'; 
import { slideInDownAnimation     } from '../../animations/animations' 

@Component({ 
    selector: 'team-component', 
    templateUrl: `../app/modules/dashboard/dashComponents/teamComponents/team.component.html`, 
    animations: [slideInDownAnimation], 

}) 

export class TeamComponent implements OnInit { 
    @HostBinding('@routeAnimation') routeAnimation = true; 
    @HostBinding('style.display') display = 'block'; 
    @HostBinding('style.position') position = 'absolute'; 

    constructor(private teamService: TeamService) { 
    } 


    ngOnInit() { 
    this.leaveType.push({ id: 0, type: 'Earned Leave' }); 
    console.log(this.leaveType); 
    } 
    private leaveType:any=[]; 
    public leave:any= { "employee": null, "from": null, "to": null,'leaveType':null }; 

}

团队component.html：

<div class="row"> 
      <h4>Leave Type:</h4> 
      <div class="form-group col-md-10"> 
       <select id="leaveType" class="form-control" name="leaveType" [(ngModel)]="leave.leaveType" required #leaveType="ngModel"> 
      <option *ngFor="let p of leaveType" [value]="p.type">{{p.type}}</option> 
     </select> 
       <div *ngIf="leaveType.errors && leaveType.touched" class="alert alert-danger"> 
       <div [hidden]="!leaveType.errors.required && leaveformSubmitted">Leave type is required</div> 
       </div> 
      </div> 
      </div>

来源

2017-02-28 Shubham Verma

您的HTML名称冲突。

<select id="leaveType" class="form-control" name="leaveType" [(ngModel)]="leave.leaveType" required #leaveType="ngModel">

你select既有name和id设定为leaveType这可能不是你的拍摄数组中*ngFor。

来源

2017-02-28 06:13:36

你说得对@苏拉杰，我用leaveTypes然后它的工作。非常感谢。 –

您需要将'leaveType'声明为数组。这样的 -

 
.... 
private leaveType: any[] = []; 
public leave:any= { "employee": null, "from": null, "to": null,'leaveType':[] }; 
....

来源

2017-02-28 06:15:59

已经声明为'private leaveType：any = [];' –

leaveType应该被声明为数组：

private leaveType:any[] = [];

来源

2017-02-28 06:27:24 pixelbits

在Angular 2中，无法找到类型为'leaveType'的不同支持对象'[object Object]'。 NgFor只支持绑定到Iterables，比如数组

回答

相关问题