添加 CoockieService (Angular2-Cookie) 提供程序时出现 404

Question

我想在我的 Angular 2 项目中使用 cookie，并尝试在我的项目中实施 angular2-cookie。我按照 here.

的说明进行操作

这是我当前的代码：

import { Component, OnDestroy } from 'angular2/core';
import { ROUTER_DIRECTIVES } from 'angular2/router';
import {CookieService} from 'angular2-cookie/core';

@Component({
    templateUrl: 'app/fragen/fragen.component.html',
    directives: [ROUTER_DIRECTIVES]
})
export class FragenComponent implements OnDestroy {
    public pageTitle: string = 'Wettbewerbs Fragen';
}

当我添加 providers: [CookieService] 时，我在浏览器控制台中收到 404（未找到）错误。

我使用 npm 正确安装了 angular2-cookie/core，并且我正在使用 TypeScript。

当我像这样添加构造函数时它也不起作用:

constructor(private _cookieService:CookieService){}

错误信息：

angular2-polyfills.js:126 GET http://localhost:3000/angular2-cookie/core 404 (Not Found)scheduleTask @ angular2-polyfills.js:126ZoneDelegate.scheduleTask @ angular2-polyfills.js:403Zone.scheduleMacroTask @ angular2-polyfills.js:340(anonymous function) @ angular2-polyfills.js:147send @ VM34076:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ angular2-polyfills.js:648(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ angular2-polyfills.js:390Zone.run @ angular2-polyfills.js:283(anonymous function) @ angular2-polyfills.js:635ZoneDelegate.invokeTask @ angular2-polyfills.js:423Zone.runTask @ angular2-polyfills.js:320drainMicroTaskQueue @ angular2-polyfills.js:541ZoneTask.invoke @ angular2-polyfills.js:493

angular2-polyfills.js:390 Error: Error: XHR error (404 Not Found) loading http://localhost:3000/angular2-cookie/core(…)ZoneDelegate.invoke @ angular2-polyfills.js:390Zone.run @ angular2-polyfills.js:283(anonymous function) @ angular2-polyfills.js:635ZoneDelegate.invokeTask @ angular2-polyfills.js:423Zone.runTask @ angular2-polyfills.js:320drainMicroTaskQueue @ angular2-polyfills.js:541ZoneTask.invoke @ angular2-polyfills.js:493

Answer 1

我认为您忘记在 SystemJS 中配置库：

var map = {
  'app':                        'app', // 'dist', 
  'rxjs':                       'node_modules/rxjs',
  'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
  '@angular':                   'node_modules/@angular',
  'angular2-cookie':            'node_modules/angular2-cookie', // <----
};

var packages = {
  'app':                        { main: 'main.js',  defaultExtension: 'js' },
  'angular2-cookie':            { main: 'core.js',  defaultExtension: 'js' }, // <-----------
  'rxjs':                       { defaultExtension: 'js' },
  'angular2-in-memory-web-api': { defaultExtension: 'js' },
};

请注意，还为库提供了一个捆绑文件：

<script src="node_modules/angular2-cookie/bundles/angular2-cookie.js"></script>

此外，此文件包含带有 js 扩展名的模块名称，因此您需要以这种方式导入其核心模块：

import from 'angular2-cookie/core.js';

我认为第一种方法最好...

添加 CoockieService (Angular2-Cookie) 提供程序时出现 404

404 when CoockieService (Angular2-Cookie) provider gets added

cookies

http-status-code-404

typescript

angular