【问题标题】:Prerendering failed because of error: ReferenceError: Event is not defined with PrimeNG AutoComplete由于错误,预渲染失败:ReferenceError:事件未使用 PrimeNG 自动完成定义
【发布时间】:2017-09-12 13:22:15
【问题描述】:

我正在尝试在我的 angular2 应用程序(primeng 2.0.5、Angular 2.0.x)中使用 PrimgNG。我可以让 ButtonModule 和 InputTextModule 工作,但不能让 AutoCompleteModule 工作。

我在将 AutoCompleteModule 添加到应用程序后立即收到此错误。

An unhandled exception occurred while processing the request.

Exception: Call to Node module failed with error: Prerendering failed because of error: ReferenceError: Event is not defined

app.component.html:

<button pButton type="button" (click)="onclick()" >Click here</button>
<p-autoComplete [(ngModel)]="text" [suggestions]="results" (completeMethod)="search($event)"></p-autoComplete>

app.component.ts:

import { Component, OnInit } from '@angular/core';
import {ButtonModule, ToggleButtonModule} from 'primeng/primeng';

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

export class AppComponent {
  text: string;
  results: string[];
  search(event){
    this.results = ['1','2','3'];
  }

  onclick():void{
    alert("This is a test");
  }
}

app.module.ts:

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { UniversalModule } from 'angular2-universal';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';

import { AppComponent } from './components/app/app.component'
import {ButtonModule, AutoCompleteModule} from 'primeng/primeng';

@NgModule({
    bootstrap: [AppComponent],
    declarations: [
        AppComponent
    ],
    imports: [
        HttpModule,
        FormsModule,
        RouterModule.forRoot([
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: 'home', component: HomeComponent },
            { path: 'api-list', component: ApiListComponent },
            { path: 'api-add', component: ApiAddComponent },
            { path: '**', redirectTo: 'home', pathMatch: 'full' }
        ]),
        AutoCompleteModule,
        UniversalModule
    ]
})
export class AppModule {
}

如果我删除 AutoCompleteModule,一切正常。请帮忙。

【问题讨论】:

    标签: angular primeng


    【解决方案1】:

    使用以下步骤

    1.“加载中……” 2.在Browser.ts文件或boot.client.ts文件中导入如下**import es6-shim**

    【讨论】:

      【解决方案2】:

      只需取消预渲染。

      <app>Loading...</app>
      

      几周前我在 stackoverflow 上找到了这个答案,尝试再次搜索它以将其链接到此处,但没有产生任何结果。如果有人找到它,请在此处链接。谢谢

      【讨论】:

        【解决方案3】:

        我能够通过更改由 ASP.Net Core 模板生成的 Index.cshtml 页面中的 asp-prerender 标记来解决这个问题。我错过了我的问题中关于 ASP.Net Core 模板的要点。

        我从

        更改了标签
        <app asp-prerender-module="ClientApp/dist/main-server">Loading...</app>
        

        <app asp-ng2-prerender-module="ClientApp/dist/main-server">Loading...</app>
        

        【讨论】:

        • @EvgenyBychkov 因为性能影响而投反对票?如果您知道另一种解决此问题的方法,如果您能给我一个解决方案,我将不胜感激。
        • 好像primeng不支持服务端渲染
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2018-03-23
        • 2017-10-23
        • 1970-01-01
        • 2018-02-02
        • 2019-09-08
        • 2015-02-12
        • 1970-01-01
        相关资源
        最近更新 更多