Angular 2-未捕获(承诺):TypeError:无法读取未定义的属性“ title”

戈西亚正在编码

当我尝试添加带有双重绑定的文本输入字段时,我在应用程序中看到此错误:

   ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'title' of undefined
TypeError: Cannot read property 'title' of undefined
    at Object.eval [as updateRenderer] (ng:///AppModule/TapesComponent.ngfactory.js:660:29)
    at Object.debugUpdateRenderer [as updateRenderer] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12658:21)
    at checkAndUpdateView (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12037:14)
    at callViewAction (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12347:17)
    at execComponentViewsAction (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12293:13)
    at checkAndUpdateView (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12038:5)
    at callWithDebugContext (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:13020:42)
    at Object.debugCheckAndUpdateView [as checkAndUpdateView] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12560:12)
    at ViewRef_.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:10129:63)
    at RouterOutlet.activateWith (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:5378:42)
    at ActivateRoutes.placeComponentIntoOutlet (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4558:16)
    at ActivateRoutes.activateRoutes (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4539:26)
    at eval (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4475:58)
    at Array.forEach (native)
    at ActivateRoutes.activateChildRoutes (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4475:29)
    at Object.eval [as updateRenderer] (ng:///AppModule/TapesComponent.ngfactory.js:660:29)
    at Object.debugUpdateRenderer [as updateRenderer] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12658:21)
    at checkAndUpdateView (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12037:14)
    at callViewAction (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12347:17)
    at execComponentViewsAction (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12293:13)
    at checkAndUpdateView (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12038:5)
    at callWithDebugContext (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:13020:42)
    at Object.debugCheckAndUpdateView [as checkAndUpdateView] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12560:12)
    at ViewRef_.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:10129:63)
    at RouterOutlet.activateWith (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:5378:42)
    at ActivateRoutes.placeComponentIntoOutlet (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4558:16)
    at ActivateRoutes.activateRoutes (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4539:26)
    at eval (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4475:58)
    at Array.forEach (native)
    at ActivateRoutes.activateChildRoutes (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:4475:29)
    at resolvePromise (http://localhost:3000/node_modules/zone.js/dist/zone.js:712:31) [angular]
    at resolvePromise (http://localhost:3000/node_modules/zone.js/dist/zone.js:683:17) [angular]
    at http://localhost:3000/node_modules/zone.js/dist/zone.js:760:17 [angular]
    at Object.onInvokeTask (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:4123:37) [angular]
    at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:397:36) [angular]
    at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:165:47) [<root> => angular]
    at drainMicroTaskQueue (http://localhost:3000/node_modules/zone.js/dist/zone.js:593:35) [<root>]
    at HTMLAnchorElement.ZoneTask.invoke (http://localhost:3000/node_modules/zone.js/dist/zone.js:464:25) [<root>]

我有这个Tape类:

    export class Tape {
  constructor (
  public id: number,
  public title: string,
  public date?: string,
  public rating?: number,
  public description?: string,
  public photo?: string){}
}

和组件

import { Component, OnInit } from '@angular/core';
import { Tape } from './tape'
import { TapeService } from './tape.service';
import { Router } from '@angular/router';
// import { TitlePipe } from './titleFilter';

@Component({
  selector: 'my-tapes',
  templateUrl: './tapes.component.html',
  styleUrls: [`./tapes.component.css`],
  providers: [TapeService],

})
export class TapesComponent implements OnInit {
  pageName = 'VHS Movies listing';
  tapes: Tape[];
  selectedTape: Tape;
  model = new Tape(0,'s','s',0,'s','sS'); 

组件HTML看起来像

<div class="form-group">
              <label for="title">Title{{model.title}}</label>
              <input type="text" class="form-control" id="title" required [(ngModel)]="model.title" name="title" #title="ngModel">              Written text: {{tape.title}}
              <div [hidden]="title.valid || title.pristine" class="alert alert-danger">
                Title is mandatory
              </div>
            </div>

我刚刚开始学习Angular 2,但对我来说,它应该从模块中获得标题。他他看不懂标题吗?

萨耶塔兰(Sajeetharan)

尝试使用safe /elvis运算符检查值是否存在,然后显示,

 <input type="text" class="form-control" id="title" required [(ngModel)]="model?.title" name="title" #title="ngModel"> Written text: {{model?.title}}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Ionic 3和Angular 4-未捕获(承诺):TypeError:无法读取未定义的属性“ title”

错误:未捕获(承诺):TypeError:无法读取未定义的属性“ title”

Google Picker API + Angular2收到未捕获的TypeError:无法读取未定义的属性'handleAuthResult'

Angular 2 RC4最新-扩展时“未捕获的TypeError:无法读取未定义的属性'prototype'”

Angular 7-错误错误:未捕获(承诺):TypeError:无法读取未定义的属性“ forEach”

Angular 2 TypeError:无法读取未定义的属性“ toUpperCase”

错误TypeError:无法读取未定义的Angular Firebase的属性'title'

(RSS Feed)未捕获的TypeError:无法读取未定义的属性“ title”

@ angular / cli @ 1.7.4-未捕获的TypeError:无法读取未定义的属性“模块”

NgZone / Angular2 / Ionic2 TypeError:无法读取未定义的属性“运行”

angular2:错误:TypeError:无法读取未定义的属性“ ...”

Angular 2异常:TypeError:无法读取未定义的属性“ annotations”

TypeError:无法读取angular2中未定义的属性“ 0”以在datepicker中使用索引

Webpacked Angular2应用程序TypeError:无法读取未定义的属性“ getOptional”

Angular 2-TypeError:无法读取未定义的属性“ apply”

Angular2:TypeError:无法读取未定义的属性“ Symbol(Symbol.iterator)”

Typescript / Angular2 TypeError:无法读取未定义的属性

Angular / DataTables:TypeError:无法读取未定义的属性“aDataSort”与 2 个 API 调用

Angular 2 rc1 TypeError:无法读取未定义的属性“注释”

Angular4 ng2-charts TypeError:无法读取未定义的属性“长度”

IONIC 4 + Angular7:错误错误:未捕获(承诺):类型错误:无法读取未定义的属性“then”

无法读取Angular 2中未定义的属性“错误”?

Angular 2`无法读取未定义的属性'dataService'

Angular2:无法读取未定义的属性“名称”

无法读取未定义的属性“ post”-Angular 2

Angular2无法读取未定义的属性“ push”

无法读取未定义[Angular2]的属性“ isStopped”

无法读取未定义angular2的属性

Angular - Ionic 2 - 无法读取未定义的属性“订阅”