InMemoryWebApi: Angular 2 RC6 + Webpack.无法解析InMemoryBackEndS

InMemoryWebApi: Angular 2 RC6 + Webpack. Cannot resolve all parameters for InMemoryBackEndService

本文关键字:InMemoryBackEndS Webpack Angular RC6 InMemoryWebApi      更新时间:2023-09-26

我无法弄清楚,为什么我不能在inMemoryWebApi中检索模拟数据。我做了所有的构型好了,横角。但是我仍然得到相同的错误。即使我删除url并留下空白,错误也是一样的。

错误:

Error: Can't resolve all parameters for InMemoryBackendService: (?, ?).

我正在使用webpack,也许这是一个原因。我应该在Webpack的某个地方声明inMemoryWebApi配置吗?或者在helpers.js中?

我已经把它添加到vendor。它被webpack.common.js获取

Vendor.ts:

// Angular 2
import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
import '@angular/router';
import 'angular2-in-memory-web-api';
import 'reflect-metadata';
// RxJS
import 'rxjs';
//Other vendors
import 'bootstrap-css-only';

Helpers.js:

var path = require('path');
var _root = path.resolve(__dirname, '..');
function root(args) {
    args = Array.prototype.slice.call(arguments, 0);
    return path.join.apply(path, [_root].concat(args));
}
exports.root = root;

AppModule:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }   from '@angular/forms';
import { HttpModule, JsonpModule }    from '@angular/http';
import { AlertModule, DatepickerModule } from 'ng2-bootstrap/ng2-bootstrap';
// Imports for loading & configuring the in-memory web api
import { InMemoryWebApiModule } from 'angular2-in-memory-web-api';
import { InMemoryData } from './in-memory-data';
import { AppComponent }   from './app.component';
import { AppService } from './app.service';
import { routing } from './app.routing';
@NgModule({
  imports: [
    BrowserModule,
    AlertModule,
    FormsModule,
    HttpModule,
    DatepickerModule,
    InMemoryWebApiModule.forRoot(InMemoryData)
    //routing
  ],
  declarations: [AppComponent],
  providers: [
    AppService
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

webpack.common:

var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var helpers = require('./helpers');
module.exports = {
    entry: {
        'polyfills': './src/polyfills.ts',
        'vendor': './src/vendor.ts',
        'app': './src/main.ts'
    },

    resolve: {
        extensions: ['', '.js', '.ts']
    },
    module: {
        loaders: [
            {
                test: /'.ts$/,
                loaders: ['ts', 'angular2-template-loader']
            },
            {
                test: /'.html$/,
                loader: 'html'
            },
            {
                test: /'.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
                loader: 'file?name=assets/[name].[hash].[ext]'
            },
            {
                test: /'.css$/,
                exclude: helpers.root('src', 'app'),
                loader: ExtractTextPlugin.extract('style', 'css?sourceMap')
            },
            {
                test: /'.css$/,
                include: helpers.root('src', 'app'),
                loader: 'raw'
            },
            {
                test: /'.scss$/,
                exclude: helpers.root('src', 'app'),
                loaders: ['raw', 'sass']
            }
        ]
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin({
            name: ['app', 'vendor', 'polyfills']
        }),
        new HtmlWebpackPlugin({
            template: 'src/index.html'
        })
    ]
};

InMemoryData:

import { InMemoryDbService } from 'angular2-in-memory-web-api';
export class InMemoryData implements InMemoryDbService {
    createDb() {
        let memcache = {
            id: 1,
            cif: "11676096",
            name: 'Barbara'
        };
    return { memcache }
  }
}
服务:

import { Injectable } from '@angular/core';
import { Headers, Http } from '@angular/http';
import { OfferModel } from './app.offers.model';
import { MemcacheModel } from './app.memcache.model';
import 'rxjs/add/operator/toPromise';
@Injectable()
export class AppService {
    private memcacheUrl = "app/memcache";
    constructor( public http: Http ) {
    }
    getMemcache(): Promise<MemcacheModel> {
        return this.http.get( this.memcacheUrl )
            .toPromise()
            .then( response => response.json().data as MemcacheModel )
            .catch( this.handleError );
    }
    handleError( error: any ) {
        console.log( 'An error has occured: ', error );
        return Promise.reject( error.message || error );
    }
}

上次我使用systemJS,在那里配置了'in-memory-web-api'。请提示,如何解决这个错误,并继续前进。

谢谢Bosper

当尝试使用Angular2 Webpack Starter实现in-memory-web-api时,同样的错误没有解决方案!

相关文章:
  • 没有找到相关文章