Angular 2 не может включать материал lib

Question

Я использую Microsoft Angle 2, пример Microsoft.AspNetCore.SpaTemplates, я установил модуль angular / materiel npm и попытался включить его для использования исходного материала.

РЕДАКТИРОВАТЬ - Новый вопрос опубликован относительно удаления рендеринга на стороне сервера.

Ссылка - Нажмите здесь

Я попытался импортировать его в app.module.ts и после этого, похоже, больше не загружал мое приложение.

@NgModule({
bootstrap: [ AppComponent ],
declarations: [
    AppComponent,
    HeaderComponent,
    LoginComponent
],
imports: [
    UniversalModule, // Must be first import. This automatically imports BrowserModule, HttpModule, and JsonpModule too.
    RouterModule.forRoot([
        { path: '', redirectTo: 'account', pathMatch: 'full' },
        { path: 'login', component: LoginComponent },
        { path: '**', redirectTo: 'account' }
    ]), MaterialModule
]

})

Сейчас я пытаюсь создать простой вид входа в систему с окном ввода адреса электронной почты и пароля. Я хотел использовать угловой материал, чтобы он выглядел лучше.

Вот мое исключение при загрузке страницы.

An unhandled exception occurred while processing the request.

Exception: Call to Node module failed with error: Error: This method is not implemented in Parse5DomAdapter: getCookie
at _notImplemented (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:91062:12) [angular]
at Parse5DomAdapter.module.exports.Parse5DomAdapter.getCookie (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:91657:69) [angular]
at CookieXSRFStrategy.configureRequest (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:63677:109) [angular]
at XHRBackend.createConnection (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:63726:32) [angular]
at httpRequest (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:64076:24) [angular]
at Http.request (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:64185:38) [angular]
at Http.get (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:64199:25) [angular]
at AccountService.ping (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\main-server.js:22373:30) [angular]
at new AccountService (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\main-server.js:22370:14) [angular]
at CompiledTemplate.proxyViewClass.View_AppComponent0.createInternal (/AppModule/AppComponent/component.ngfactory.js:15:30) [angular]
at CompiledTemplate.proxyViewClass.AppView.create (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:11951:25) [angular]
at CompiledTemplate.proxyViewClass.View_AppComponent_Host0.createInternal (/AppModule/AppComponent/host.ngfactory.js:15:19) [angular]
at CompiledTemplate.proxyViewClass.AppView.createHostView (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:11964:25) [angular]
at ComponentFactory.create (C:\Users\baile\Source\Repos\Programming2017\BankSoftware\ClientApp\dist\vendor.js:7361:29) [angular]

Теперь я понимаю, что универсальный модуль - это то, что создает предварительный рендеринг. Это действительно здорово, и все кроме того, чтобы быть полностью честным, мне это не нужно.

Пересмотреть мой вопрос сейчас. Как кто-то может взять Microsoft.AspNetCore.SpaTemplate для angular 2 и удалить универсальный модуль, и при этом все еще иметь работающий угловой сайт. Простое удаление универсального модуля из импорта приводит к появлению других ошибок. Какие изменения необходимо внести в другие разделы шаблона, и я теряю что-либо, кроме предварительного рендеринга на стороне сервера?

Answer 1

У меня была та же проблема, и я решил ее, поместив MaterialModule перед UniversalModule. Я знаю, что шаблон SPA говорит, что он должен идти первым, но этот порядок, похоже, сломал его.

imports: [
        MaterialModule.forRoot(),
        UniversalModule, // Must be first import. This automatically imports BrowserModule, HttpModule, and JsonpModule too.

        RouterModule.forRoot([
            { path: '', redirectTo: 'account', pathMatch: 'full' },
            { path: 'account', component: AccountListComponent },
            { path: 'detail/:id', component: AccountDetailComponent },
            { path: '**', redirectTo: 'account' }
        ])
    ],

Редактировать - на самом деле, это выглядит сложнее, чем это. Вот проблема с GitHub: https://github.com/angular/material2/issues/308

В итоге я вытащил UniversalModule, потому что Angular Material был для меня важнее, чем рендеринг на стороне сервера. Есть несколько изменений, которые вам нужно будет сделать, чтобы шаблон SPA работал с Angular Material. Дайте мне знать, если вам нужна дополнительная помощь.

---

редактировать

Я проголосовал за этот вопрос, поскольку ФП пометил мой ответ, а затем оставил отметку, несмотря на значительные усилия по оказанию помощи Ответ, который я предоставил, является правильным ответом.