我试图通过" ProductService.ts"中的observables执行http调用,导入到" ProductComponent.ts"哪个人怀疑它。我想我已经涵盖了所需的一切,但我得到了错误:
错误:意外的价值' ProductService'由模块“AppModule'”宣布。
有人可以指出我哪里出错吗?
的AppModule:
/* angular */
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { CommonModule } from "@angular/common";
/* third party */
import { TooltipModule } from "ngx-tooltip";
import { NgRedux, NgReduxModule } from 'ng2-redux';
import { Ng2Bs3ModalModule } from 'ng2-bs3-modal/ng2-bs3-modal';
import { RootReducer, IAppStore } from './state/state.store';
/* components */
import { BaseComponent } from './base.component';
import { HeaderComponent } from './includes/header.component';
import { FooterComponent } from './includes/footer.component';
import { NavigationComponent } from './includes/navigation.component';
import { MapComponent } from './components/maps/map.component';
import { ToolbarComponent } from './components/ui/toolbar/toolbar.component';
import { SearchComponent } from './components/ui/search/search.component';
import { StoreComponent } from './state/state.component';
import { ModalComponent } from './components/ui/modal/modal.component';
import { UserComponent } from './components/users/user.component';
import { CategoryComponent } from './services/products/category.component';
import { ProductComponent } from './services/products/product.component';
import { ProductDetails } from './services/products/productdetails.component';
import { CartComponent } from './services/cart/cart.component';
import { CheckoutComponent } from './services/checkout/checkout.component';
import { NotificationComponent } from './components/ui/notifications/notification.component';
import { PanelComponent } from './components/ui/panel/panel.component';
import { UIController } from './components/ui/uinav/uicontroller.component';
import { ProductService } from './services/products/product.service';
/* views */
import { HomeComponent } from './views/home.view';
import { ContactComponent } from './views/contact.view';
import { AboutComponent } from './views/about.view';
import { MainComponent } from './views/main.view';
import { FormsComponent } from './views/forms.view';
import { PlansView } from './views/plans.view';
import { ProductView } from './views/products.view';
/* routers */
import { routing } from './routers/routing.route';
/* custom */
import { ScrollTo } from './helpers/ScrollCtrl';
import { MenuCtrl } from './helpers/MenuCtrl';
@NgModule({
declarations: [
BaseComponent,
HomeComponent,
AboutComponent,
ContactComponent,
FormsComponent,
HeaderComponent,
FooterComponent,
NavigationComponent,
MainComponent,
MapComponent,
ModalComponent,
ToolbarComponent,
StoreComponent,
UserComponent,
CategoryComponent,
ProductComponent,
ProductDetails,
CartComponent,
CheckoutComponent,
SearchComponent,
NotificationComponent,
PanelComponent,
ProductView,
PlansView,
UIController,
ProductService
],
exports:[
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
routing,
NgReduxModule,
Ng2Bs3ModalModule,
TooltipModule
],
providers: [],
bootstrap: [
BaseComponent
]
})
export class AppModule {
constructor(ngRedux: NgRedux<IAppStore>) {
ngRedux.configureStore(RootReducer, {
appState: null
});
}
}
ProductComponent:
import { Component, OnInit } from '@angular/core';
import { Product } from './product.entity';
import { ProductService } from './product.service';
import { ProductCategory } from './productcategory.entity';
@Component({
selector: 'e-productlist',
templateUrl: './templates/products.template.html'
})
export class ProductComponent implements OnInit {
public productList: Product[];
constructor(private _productService: ProductService) {
}
ngOnInit(){
this._productService.GetAllProducts().subscribe(response => this.productList);
}
}
ProductService.ts
import { Injectable } from '@angular/core';
import { Product } from './product.entity';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/observable';
import { ProductCategory } from './productcategory.entity';
import 'rxjs/add/operator/map';
@Injectable()
export class ProductService implements IProductService {
private productCategories: ProductCategory[];
private products: Product[];
private queryUrl = "../../../products-list.json";
constructor(public _http: Http) {
}
GetAllProducts() {
return this._http.get(this.queryUrl).map((_response:Response) => this.products = _response.json());
}
}
答案 0 :(得分:2)
您不申报服务。你提供他们。将它从声明移动到提供者并且应该清理它(也就是说,只要你的服务全部被整理出来并且正确等等)。