Angular 我不知道为什么会出现这些错误

Angular 我不知道为什么会出现这些错误,angular,typescript,autocomplete,angular-forms,angular-ngselect,Angular,Typescript,Autocomplete,Angular Forms,Angular Ngselect,我开发了自动填充表单,它基于ng select数据自动填充数据。但我面临的唯一问题是,当我试图删除所选数据时,它会向我抛出一个空错误的无法读取属性“pincode”。请查找并尝试解决此错误。我在下面分享我的代码。 提前谢谢 register-component.html register-page.component.ts 当我点击该十字输入新数据时。它向我显示了这两个错误这个错误是因为您在PinSelected组件中没有定义属性village,您可以将HTML的第60行从PinSelected

我开发了自动填充表单,它基于ng select数据自动填充数据。但我面临的唯一问题是,当我试图删除所选数据时,它会向我抛出一个空错误的无法读取属性“pincode”。请查找并尝试解决此错误。我在下面分享我的代码。 提前谢谢

register-component.html register-page.component.ts
当我点击该十字输入新数据时。它向我显示了这两个错误

这个错误是因为您在PinSelected组件中没有定义属性village,您可以将HTML的第60行从PinSelected.village更改为PinSelected?.village来修复它。village

您有3-4个div标记,您正在根据以前的div填充数据

您可以将3-4个div标记封装到另一个div标记或ng容器标记中,并添加如下条件

<ng-container *ngIf="pinSelected">
  <div1></div1>
  <div2></div2>
  <div3></div3>
</ng-container>

你能创建一个Stackblitz示例吗?你可以尝试使用安全运算符,尽管我不确定它在这里是否有效:PinSelected?.village-以及你在[value]中使用PinSelected的任何其他地方我对angular是新手,我不知道如何在中创建stackblitz@MikeOne你能编辑我的代码吗?这不是它的工作原理。你编辑你的代码,而不是我们。
import { Component, OnInit } from '@angular/core';
import { data } from 'jquery';
import { Pincodes } from 'src/app/Model/Pincodes';
import { MetadataServiceService } from 'src/app/shared/services/metadata-service.service';
import { Observable, of } from 'rxjs';

import 'rxjs/add/operator/filter';
import { FormGroup } from '@angular/forms';




@Component({
  selector: 'app-register-page',
  templateUrl: './register-page.component.html',
  styleUrls: ['./register-page.component.css']
})

export class RegisterPageComponent implements OnInit {

  
 observeData :Observable< Pincodes[]>  

  modifiedText: any;
  PinSelected : any = {}
 searchValue : string
 form: FormGroup;
 
 constructor(private _metadataService: MetadataServiceService) { 
   
    
    
  }

 ngOnInit(){
    
   this._metadataService.GetPincodes()
   .subscribe(res=> {
      this.observeData = res.data;
    });


  
  

  


onPincodeSelected(val : Pincodes){
    console.log("value" + val);
    this.customFunction(val)

    
  }
  customFunction(val : Pincodes){
    this.modifiedText = " Pin : " + val.pincode + "\n" + "  District : " + val.village + "\n" + "  Taluka : " + val.taluka
      console.log("modifiedText" + this.modifiedText);
      console.log("Pincode Selected" + this.PinSelected);
      console.log("observeData Selected" + this.observeData);
      
      
      
      
      
  }
  
 
  

}

<ng-container *ngIf="pinSelected">
  <div1></div1>
  <div2></div2>
  <div3></div3>
</ng-container>