Question

我遇到问题，我正在尝试为首先保存的formGroup开发一个编辑按钮，但是当您单击旁边的按钮时，模态将使用相同的数据打开，您可以对其进行编辑。

但是我遇到了这个错误，我无法解决，希望这里有人可以帮助我

ERROR TypeError：无法读取未定义的属性'startDate'

Ps：该代码可能不会作为摘要运行，但这是在此处发布我的代码的最佳方法。

import { Component, OnInit } from '@angular/core';
import {FormBuilder, FormGroup} from "@angular/forms";

@Component({
  selector: 'app-project-information-detail-edit',
  templateUrl: './project-information-detail-edit.component.html',

})
export class ProjectInformationDetailEditComponent implements OnInit {

    detailForm : FormGroup;
    constructor(private fb: FormBuilder) { }

    ngOnInit() {
        this.detailForm = this.fb.group({
            name: [''],
            phone: [''],
            startDate: [''],
            email: [''],


        });




    }

}

<form [formGroup]="detailForm">
  <div class="col-sm-6">
    <h1><span class="semi-bold">{{selectedProject.name}}</span>

      <br>
      <small *ngIf="selectedProject.startDate">
        {{selectedProject.startDate}}
      </small>
      <ng-template #noStartdate>
        <span>Nicht gesetzt</span>
      </ng-template>
    </h1>
    <ul class="list-unstyled">
      <li>
        <p class="text-muted">
          <i class="fa fa-phone"></i>&#xA0;&#xA0;
          <span *ngIf="selectedProject.phone">
                    <a href="tel:{{selectedProject.phone}}">{{selectedProject.phone}}</a>
                                                                </span>
          <ng-template #noPhoneTemplate>
            <span>Nicht verfügbar</span>
          </ng-template>
        </p>
      </li>


      <li>
        <p class="text-muted">
          <i class="fa fa-envelope"></i>&#xA0;&#xA0;
          <a *ngIf="selectedProject.email"
             href="mailto:{{selectedProject.email}}">{{selectedProject.email}}</a>
          <ng-template #noPhoneTemplate>
            <span>Nicht verfügbar</span>
          </ng-template>
        </p>
      </li>
    </ul>
  </div>
</form>

ERROR TypeError: Cannot read property 'startDate' of undefined
at Object.eval [as updateDirectives] (ProjectInformationDetailEditComponent.html:9)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:14655)
at checkAndUpdateView (core.js:13802)
at callViewAction (core.js:14153)
at execComponentViewsAction (core.js:14085)
at checkAndUpdateView (core.js:13808)
at callWithDebugContext (core.js:15056)
at Object.debugCheckAndUpdateView [as checkAndUpdateView] (core.js:14593)
at ViewRef_.detectChanges (core.js:11577)
at eval (core.js:5907)

在此处输入代码

Answer 1

尽管您没有定义selectedProject，但我假设您忘记将其添加到示例代码中（否则，应该首先在name上出现错误）

更改此行

 <small *ngIf="selectedProject.startDate">

到

 <small *ngIf="selectedProject?.startDate">

或

 <small *ngIf="selectedProject && selectedProject.startDate">

以模态角度显示数据

1 个答案: