Question

我正在关注此教学视频，Building web apps powered by Angular 2.x using Visual Studio 2017，并且 51:00 是我正在处理的部分，我在这个源文件中遇到了问题：

https://github.com/CRANK211/vs17-ng2-dnc/blob/master/3%20-%20with-data/components/shared/account.service.ts#L18

使用此功能：

getAccountSummaries() {
  return this.http.get('api/Bank/GetAccountSummaries')
    .map(response => response.json() as AccountSummary[])
    .toPromise();
}

我在.json()上的Visual Studio中收到红色文字，上面写着

符号'json'无法正确解析，可能是因为它位于无法访问的模块
中

当我尝试运行应用程序时，我收到异常消息：

System.Exception: Call to Node module failed with error: Error: Uncaught (in promise): Error: No provider for AccountService!

在教程之后，我使用了与教师相同的模板，但我认为从那时起必须有一些变化，因为他有一个app.module.ts，而我的模板有四个：app.module.client.ts，{{1和app.module.server.ts不幸的是，作为ASP.NET Core 和 Angular2的新手，我不知道他们为什么会有所不同或者意义重大。

到目前为止，我已经取得了成功，只需对他app.module.shared.ts到app.module.ts进行任何更改，您可以在此处看到：

app.module.shared.ts

编译好的所有东西都很好，就像他的import { NgModule } from '@angular/core'; import { RouterModule } from '@angular/router'; import { AppComponent } from './components/app/app.component' import { NavMenuComponent } from './components/navmenu/navmenu.component'; import { HomeComponent } from './components/home/home.component'; import { FetchDataComponent } from './components/fetchdata/fetchdata.component'; import { CounterComponent } from './components/counter/counter.component'; import { HeaderComponent } from './components/shared/header/header.component'; import { AccountListComponent } from './components/account/account-list/account-list.component'; import { AccountSummaryComponent } from './components/account/account-summary/account-summary.component'; import { AccountDetailComponent } from './components/account/account-detail/account-detail.component'; import { FormatAccountNumberPipe } from './components/shared/format-account-number.pipe'; import { AccountActivityComponent } from './components/account/acccount-activity/account-activity.component'; import { AccountService } from './components/shared/account.service'; export const sharedConfig: NgModule = { bootstrap: [ AppComponent ], declarations: [ AppComponent, NavMenuComponent, CounterComponent, FetchDataComponent, HomeComponent, HeaderComponent, AccountListComponent, AccountDetailComponent, AccountSummaryComponent, AccountActivityComponent, FormatAccountNumberPipe ], imports: [ RouterModule.forRoot([ { path: '', redirectTo: 'account', pathMatch: 'full' }, { path: 'account', component: AccountListComponent }, { path: 'detail/:id', component: AccountDetailComponent }, { path: '**', redirectTo: 'account' } ]) ], providers: [ AccountService ] };行不幸一样。

我该如何解决？

Answer 1

从Visual Studio获取的红色文本可能是因为VS无法解析响应对象。将以下内容添加到文件

时，错误应该消失

import { Response } from '@angular/http';

并更改将类型Response添加到地图函数中，如下所示：

getAccountSummaries() {
 return this.http.get('/api/Bank/GetAccountSummaries')
    .map((response: Response) => response.json() as AccountSummary[])
    .toPromise();
}

您对缺少的提供程序的另一个问题可能是因为AccountService在组件中使用，并且此组件是模块的一部分，并且此模块没有将AccountService定义为提供程序。因此，请确保您拥有的每个模块都有

providers:[ AccountService ]

在其配置中定义。

希望有所帮助

http.get响应对象 - 无法访问json（）？

1 个答案: