Angular 2:ngFor嵌套问题

时间:2017-05-10 13:31:17

标签: angular angular-cli

我正在获取嵌套问题,它显示'无法读取属性'字段'未定义'。

我尝试引用其他问题,但未能得到它。请帮助我如何正确呈现数据

// service call

this.xmldataService.getReport().subscribe(
      (report) => {
        this.group = report.CrystalReport.Group;
      });
      
      
// Error

ERROR TypeError: Cannot read property 'Field' of undefined
    at Object.eval [as updateDirectives] (AppComponent.html:23)
    at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:12641)
    at checkAndUpdateView (core.es5.js:12053)
    at callViewAction (core.es5.js:12367)
    at execEmbeddedViewsAction (core.es5.js:12339)
    at checkAndUpdateView (core.es5.js:12054)
    at callViewAction (core.es5.js:12367)
    at execComponentViewsAction (core.es5.js:12313)
    at checkAndUpdateView (core.es5.js:12059)
    at callWithDebugContext (core.es5.js:13041)
<table class="table table-bordered" *ngFor="let head of group; let i = index">
    <thead>
      <tr>
        <th *ngFor="let d of head.GroupHeader.Section.Text; let i = index">{{d.TextValue}}</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td *ngFor="let d of head.Details.Section.Field; let i = index">{{d.value}}</td>
      </tr>

    </tbody>
  </table>

下面是我的json,我得到了错误

{
	"@Level": "2",
	"Section": {
		"@SectionNumber": "0",
		"Field": [{
			"@Name": "GroupNameTEAMNO1",
			"@FieldName": "GroupName ({PDA112P.TEAM_NO})",
			"FormattedValue": "DL04",
			"Value": "DL04"
		}, {
			"@Name": "ASMPROCNO1",
			"@FieldName": "{PDA112P.ASM_PROC_NO}",
			"FormattedValue": "3H878",
			"Value": "3H878"
		}, {
			"@Name": "UNITNO1",
			"@FieldName": "{PDA112P.UNIT_NO}",
			"FormattedValue": "H83937",
			"Value": "H83937"
		}, {
			"@Name": "APPROVEDDATE1",
			"@FieldName": "{PDA112P.APPROVED_DATE}",
			"FormattedValue": null,
			"Value": null
		}, {
			"@Name": "REJECTEDDATE1",
			"@FieldName": "{PDA112P.REJECTED_DATE}",
			"FormattedValue": null,
			"Value": null
		}, {
			"@Name": "MAINTDATE1",
			"@FieldName": "{PDA112P.MAINT_DATE}",
			"FormattedValue": "04/20/2017",
			"Value": "04/20/2017"
		}, {
			"@Name": "RESNFORCHANGE1",
			"@FieldName": "{PDA112P.RESN_FOR_CHANGE}",
			"FormattedValue": "CHANGED GET TO GRASP IN WORKING POINT DETAIL NO PCF REQUIRED",
			"Value": "CHANGED GET TO GRASP IN WORKING POINT DETAIL NO PCF REQUIRED"
		}, {
			"@Name": "ISSUEDDATE1",
			"@FieldName": "{PDA112P.ISSUED_DATE}",
			"FormattedValue": null,
			"Value": null
		}]
	}
}

下面的

是组标记的输出

{"@Level":"1","GroupHeader":{"Section":{"@SectionNumber":"0","Text":[{"@Name":"Text16","TextValue":"Team"},{"@Name":"Text17","TextValue":"Process"},{"@Name":"Text18","TextValue":"Unit"},{"@Name":"Text19","TextValue":"Maint.\n\nDate"},{"@Name":"Text21","TextValue":"Unit Rank /\n\nQuality Issues"},{"@Name":"Text20","TextValue":"Description of Change"},{"@Name":"Text22","TextValue":"Issued \n\nDate"},{"@Name":"Text24","TextValue":"Rejected\n\nDate"},{"@Name":"Text23","TextValue":"Approved\n\nDate"}]}},"Details":{"@Level":"2","Section":{"@SectionNumber":"0","Field":[{"@Name":"GroupNameTEAMNO1","@FieldName":"GroupName ({PDA112P.TEAM_NO})","FormattedValue":"DL04","Value":"DL04"},{"@Name":"ASMPROCNO1","@FieldName":"{PDA112P.ASM_PROC_NO}","FormattedValue":"3H878","Value":"3H878"},{"@Name":"UNITNO1","@FieldName":"{PDA112P.UNIT_NO}","FormattedValue":"H83937","Value":"H83937"},{"@Name":"APPROVEDDATE1","@FieldName":"{PDA112P.APPROVED_DATE}","FormattedValue":null,"Value":null},{"@Name":"REJECTEDDATE1","@FieldName":"{PDA112P.REJECTED_DATE}","FormattedValue":null,"Value":null},{"@Name":"MAINTDATE1","@FieldName":"{PDA112P.MAINT_DATE}","FormattedValue":"04/20/2017","Value":"04/20/2017"},{"@Name":"RESNFORCHANGE1","@FieldName":"{PDA112P.RESN_FOR_CHANGE}","FormattedValue":"CHANGED GET TO GRASP IN WORKING POINT DETAIL NO PCF REQUIRED","Value":"CHANGED GET TO GRASP IN WORKING POINT DETAIL NO PCF REQUIRED"},{"@Name":"ISSUEDDATE1","@FieldName":"{PDA112P.ISSUED_DATE}","FormattedValue":null,"Value":null}]}}}

2 个答案:

答案 0 :(得分:0)

我认为问题在于并非'group'集合中的所有项目都有head.Details.Section字段。我建议您记录所有项目,以确保它们具有适当的字段。

答案 1 :(得分:0)

你的'value'在模板中是小写的,但在json中是大写的:'Value'

查看完整个JSON后,您还错过了几个组的“Section”属性。看到这个小提琴迭代你的整个JSON并输出每个组的'Section':https://jsfiddle.net/j3eo4u7y/(打开控制台并点击运行,查看日志)

j.CrystalReport.Group.map(g => g.Details).map(d => console.log(d.Section))