Question

我继承了一个Angular2应用程序。这是一个定制的IT票务系统。我们有一个主菜单（main.component），用户可以看到他们分配的票证列表。他们单击链接将他们带到该票证的详细页面。在故障单页面（ticket.component）上，用户在完成更改后单击“保存并退出”。然后，这将向RESTful API发送一个post请求 - 包含许多关于该票证的属性。这是通过自定义服务（ticketService.SaveTicket）完成的。这将返回订阅。一旦发布数据完成，我希望应用程序导航回主菜单。以下是附加到“保存并退出”按钮的点击事件的方法

public saveClick(): void {
    var ticketData =
      {
        'ID': this.id,
        'AssignedTo': this.AssignedToSelect,
        'Status': this.StatusSelected,
        'Category': this.CategorySelected,
        'UsersAffected': this.AffectedSelected,
        'AdviseWhenCompleted': this.AdviseToSelect
      };
    this.savingTicket = true;
    let that = this;

    this.ticketService.SaveTicket(ticketData).subscribe(x => {
      this.savingTicket = false;
      this.router.navigate(['main']);
    }, err => {
      debugger;
      swal('Aw no!', 'An error has occurred saving this ticket', 'error');
      this.savingTicket = false;
    });
  }

每当用户点击此按钮时，控制台中都会显示以下错误：

EXCEPTION: Uncaught (in promise): Error: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null

显然由于错误，应用程序无法导航到“main”。浏览器窗口也完全空白（表示JS错误）。

说实话，我不知道它指的是哪个parentElement。我相信罪魁祸首在于this.router.Navigate行，就像我发表评论时一样，错误没有出现，浏览器也没有空白。

有没有人知道为什么会这样？任何建议都非常感谢！

编辑：以下是ticket.component.html的片段 - 从第27行开始

<td style="text-align: right; width: 70%;">
    <span class="selectAutoResponse">Select Auto Repsonse:</span>
    <kendo-combobox [data]="autoResponse" [placeholder]="'- Select Value -'" [value]="selectedAutoResponse" [textField]="'ValueText'" [valueField]="'ID'" style="width: 350px" (valueChange)="handleAutoResponseChange($event)"></kendo-combobox>
</td>

编辑：以下是控制台错误的完整摘录：

:3000/node_modules/@angular/core/bundles/core.umd.js:3064 EXCEPTION: Uncaught (in promise): Error: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null
Error: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null
    at ViewWrappedError.ZoneAwareError (http://localhost:3000/node_modules/zone.js/dist/zone.js:992:33)
    at ViewWrappedError.BaseError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1239:20)
    at ViewWrappedError.WrappedError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1297:20)
    at new ViewWrappedError (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:6167:20)
    at View_TicketComponent3.DebugAppView._rethrowWithContext (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12385:27)
    at View_TicketComponent3.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12344:22)
    at ViewContainer.destroyNestedViews (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12476:41)
    at View_TicketComponent1.destroyInternal (/AppModule/TicketComponent/component.ngfactory.js:2598:15)
    at View_TicketComponent1.AppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:11986:18)
    at View_TicketComponent1.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12341:42)
    at ViewContainer.destroyNestedViews (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12476:41)
    at CompiledTemplate.proxyViewClass.View_TicketComponent0.destroyInternal (/AppModule/TicketComponent/component.ngfactory.js:2907:14)
    at CompiledTemplate.proxyViewClass.AppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:11986:18)
    at CompiledTemplate.proxyViewClass.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12341:42)
    at CompiledTemplate.proxyViewClass.View_TicketComponent_Host0.destroyInternal (/AppModule/TicketComponent/host.ngfactory.js:33:19)
ErrorHandler.handleError @ :3000/node_modules/@angular/core/bundles/core.umd.js:3064
:3000/node_modules/@angular/core/bundles/core.umd.js:3069 ORIGINAL STACKTRACE:
ErrorHandler.handleError @ :3000/node_modules/@angular/core/bundles/core.umd.js:3069
:3000/node_modules/@angular/core/bundles/core.umd.js:3070 Error: Uncaught (in promise): Error: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null
Error: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null
    at ViewWrappedError.ZoneAwareError (http://localhost:3000/node_modules/zone.js/dist/zone.js:992:33)
    at ViewWrappedError.BaseError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1239:20)
    at ViewWrappedError.WrappedError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1297:20)
    at new ViewWrappedError (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:6167:20)
    at View_TicketComponent3.DebugAppView._rethrowWithContext (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12385:27)
    at View_TicketComponent3.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12344:22)
    at ViewContainer.destroyNestedViews (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12476:41)
    at View_TicketComponent1.destroyInternal (/AppModule/TicketComponent/component.ngfactory.js:2598:15)
    at View_TicketComponent1.AppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:11986:18)
    at View_TicketComponent1.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12341:42)
    at ViewContainer.destroyNestedViews (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12476:41)
    at CompiledTemplate.proxyViewClass.View_TicketComponent0.destroyInternal (/AppModule/TicketComponent/component.ngfactory.js:2907:14)
    at CompiledTemplate.proxyViewClass.AppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:11986:18)
    at CompiledTemplate.proxyViewClass.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12341:42)
    at CompiledTemplate.proxyViewClass.View_TicketComponent_Host0.destroyInternal (/AppModule/TicketComponent/host.ngfactory.js:33:19)
    at resolvePromise (http://localhost:3000/node_modules/zone.js/dist/zone.js:665:31) [angular]
    at resolvePromise (http://localhost:3000/node_modules/zone.js/dist/zone.js:636:17) [angular]
    at http://localhost:3000/node_modules/zone.js/dist/zone.js:713:17 [angular]
    at Object.onInvokeTask (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:3971:41) [angular]
    at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:366:36) [angular]
    at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:166:47) [<root> => angular]
    at drainMicroTaskQueue (http://localhost:3000/node_modules/zone.js/dist/zone.js:546:35) [<root>]
    at XMLHttpRequest.ZoneTask.invoke (http://localhost:3000/node_modules/zone.js/dist/zone.js:424:25) [<root>]
ErrorHandler.handleError @ :3000/node_modules/@angular/core/bundles/core.umd.js:3070
zone.js:522 Unhandled Promise rejection: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null ; Zone: angular ; Task: Promise.then ; Value: ViewWrappedError Error: Error in http://localhost:3000/app/components/ticket/ticket.component.html:28:24 caused by: Cannot read property 'parentElement' of null
    at ViewWrappedError.ZoneAwareError (http://localhost:3000/node_modules/zone.js/dist/zone.js:992:33)
    at ViewWrappedError.BaseError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1239:20)
    at ViewWrappedError.WrappedError [as constructor] (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1297:20)
    at new ViewWrappedError (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:6167:20)
    at View_TicketComponent3.DebugAppView._rethrowWithContext (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12385:27)
    at View_TicketComponent3.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12344:22)
    at ViewContainer.destroyNestedViews (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12476:41)
    at View_TicketComponent1.destroyInternal (/AppModule/TicketComponent/component.ngfactory.js:2598:15)
    at View_TicketComponent1.AppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:11986:18)
    at View_TicketComponent1.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12341:42)
    at ViewContainer.destroyNestedViews (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12476:41)
    at CompiledTemplate.proxyViewClass.View_TicketComponent0.destroyInternal (/AppModule/TicketComponent/component.ngfactory.js:2907:14)
    at CompiledTemplate.proxyViewClass.AppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:11986:18)
    at CompiledTemplate.proxyViewClass.DebugAppView.destroy (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:12341:42)
    at CompiledTemplate.proxyViewClass.View_TicketComponent_Host0.destroyInternal (/AppModule/TicketComponent/host.ngfactory.js:33:19)
consoleError @ zone.js:522
zone.js:524 ZoneAwareError

Answer 1

目前还不清楚（根据您发布的代码）但我打赌您的问题来自于“kendo-combobox”在保存故障单后未能正确初始化。查看该组件内部并确保它将默认模型设置为空模型（通常在ngInit或它的构造函数中。）

Angular2 - 路由错误

1 个答案: