首页 > 解决方案 > 未捕获的类型错误:无法读取未定义 core.js:24134 的属性“id”

问题描述

我正在开发 Ionic 应用程序,作为一个新手,我在控制台中遇到这些问题并且无法识别错误,所以请在控制台中帮助我解决这个错误我将首先在控制台中显示错误这些错误重复很多项目所以请帮我解决这个错误,因为我无法获得任何浏览器输出我的 vscode 也没有显示任何错误

 Uncaught TypeError: Cannot read property 'id' of undefined  core.js:24134

    at registerNgModuleType (core.js:24134)
    at core.js:24145
    at Array.forEach (<anonymous>)
    at registerNgModuleType (core.js:24145)
    at new NgModuleFactory$1 (core.js:24242)
    at compileNgModuleFactory__POST_R3__ (core.js:27786)
    at PlatformRef.bootstrapModule (core.js:28024)
    at Module../src/main.ts (main.ts:11)
    at __webpack_require__ (bootstrap:84)
    at Object.0 (main.ts:12)


HTML CODE:i did my coding here, if there is anything i need to change in my coding [please mention that also]

我的代码我正在创建学生标记列表,我需要在数组中获取不同学生的标记,以便我可以创建此任务并为学校添加我的应用程序,另外几个任务以这种方式类似,所以请帮助我完成这项任务,这反过来将帮助我完成其他任务,也谢谢你。

<ion-header>
  <ion-toolbar>
    <ion-title>marklist</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
 
    <ion-item>
        <ion-label placeholder="Class">Class</ion-label>
        <ion-select slot="end">
        <ion-select-option >class(1-5)</ion-select-option>
        <ion-select-option >class(6-12)</ion-select-option>
        </ion-select>
    </ion-item>
        
    <ion-item>
        <ion-button *ngIf="hell" (click)="CreateRecord()" [disabled]="false">
        <ion-icon size="small" slot="icon-only" name="add"></ion-icon>&nbsp;CreateRecord </ion-button>

        <ion-button *ngIf="!hell"(click)="CreateRecord()">
        <ion-icon size="small" slot="icon-only" name="add"></ion-icon>&nbsp;HideRecord</ion-button>
    </ion-item>

  <ng-container *ngIf="!hell">
    <ion-grid>
        <ion-row>
          <ion-col style="font-size: larger;margin-left: 40px;">Sno</ion-col>
          <ion-col style="font-size: larger;margin-left: 180px;">Subject</ion-col>
          <ion-col style="font-size: larger;margin-left: 250px;" >Mark</ion-col>
       </ion-row>
    </ion-grid>
    
    <ng-container *ngFor="let num of subject;let i=index">
      <ion-grid>
      <ion-row> 
        <ion-col><ion-card"><ion-input value="{{i+1}}"></ion-input></ion-card></ion-col>
        <ion-col><ion-card"><ion-input type ="text-only"></ion-input></ion-card></ion-col>
        <ion-col><ion-card"><ion-input type ="number" [(ngModel)]="v1[i]" ></ion-input></ion-card></ion-col>
      </ion-row>
      </ion-grid>
    </ng-container>

      <div>
        <ion-button (click)="addForm()" class="btn btn-success">+</ion-button>
        <ion-button (click)="subForm()" class="btn btn-danger">-</ion-button>
      </div>
      
      </ng-container>
      <ion-card>
        <ion-label>Total</ion-label>
        <ion-input type="number">{{v1[i]}}</ion-input>
      </ion-card>
</ion-content>


typescript codes:

import { IonicModule } from '@ionic/angular';

import { FormsModule, FormGroup, FormControl, ReactiveFormsModule } from '@angular/forms';

import { Component, OnInit, NgModule } from '@angular/core';

import {MarklistService} from './marklist.service';


@Component({
 
 selector: 'app-marklist',
  
templateUrl: './marklist.page.html',
 
 styleUrls: ['./marklist.page.scss'],

})

export class MarklistPage implements OnInit {


i:any; 

v1:number[];

subject:number[];

hell:boolean = true;

n=1;index:any;


constructor() { }

  
ngOnInit() {
    
this.subject = Array(this.n).fill(0).map((x,i)=>i);


  }
  
CreateRecord(){

       this.hell=!this.hell;

  }



  addForm(){
   
 this.n++;
 
 this.subject = Array(this.n).fill(0).map((x,i)=>i);
 
 }
 
 
 subForm(){
  
 
   this.subject = Array(this.n).splice(this.index,this.n--);
 
 }

}

    

我正面临这些问题先生/妈妈,所以请帮我确定未定义的 id 问题谢谢

标签: angulartypescript

解决方案


您刚刚共享的代码部分很难判断。您正在使用的数组似乎存在问题 - 我猜这是您在共享的 html 中运行的主题。

当对象不存在时,当您尝试引用对象属性(例如“id”)时,通常会弹出错误。

即,下面的代码会抛出类似的错误:

let student: Student; 
student.id = 6;

正确的实施将是:

let student: Student = {
id: 6
}

如果您在循环中运行,则可以为给定对象添加空检查。

if (student) {
student.id = 6;
}

希望它有所帮助。


推荐阅读