How to use Angular2 with ng2-cookie

Question

GET http://localhost/ng2-cookies/ng2-cookies 404 (Not Found)

Here is my error log.

I'm trying to use ng2-cookies module on my project.

Here is app.component.ts

import {Cookie} from 'ng2-cookies/ng2-cookies';

Cookie.setCookie('ticket_status', responses.data.ticket);

console.log(Cookie.getCookie('ticket_status'));

What kind of problem? Please help

Answer 1

I faced a similar problem. Solved it by doing following changes in system.config.js file and it worked -

1. Add ng2-cookies to map entry 'ng2-cookies': 'node_modules/ng2-cookies'

2. Add ng2-cookies to packages entry 'ng2-cookies':{ defaultExtension: 'js' }

Answer 2

Try this

Cookie.set('ticket_status', "hello");
console.log(Cookie.get('ticket_status'));

We don't have method like:

setCookie and getCookie in Js class

Extract from JS class


    /**
     * Retrieves a single cookie by it's name
     *
     * @param  {string} name Identification of the Cookie
     * @returns The Cookie's value
     */
    public static get(name: string): string  {
        if (Cookie.check(name)) {
            name = encodeURIComponent(name);
            let regexp = new RegExp('(?:^' + name + '|;\\s*' + name + ')=(.*?)(?:;|$)', 'g');
            let result = regexp.exec(document.cookie);
            return decodeURIComponent(result[1]);
        } else {
            return '';
        }   
    }


/**
     * Save the Cookie
     *
     * @param  {string} name Cookie's identification
     * @param  {string} value Cookie's value
     * @param  {number} expires Cookie's expiration date in days from now. If it's undefined the cookie is a session Cookie
     * @param  {string} path Path relative to the domain where the cookie should be avaiable. Default /
     * @param  {string} domain Domain where the cookie should be avaiable. Default current domain
     * @param  {boolean} secure If true, the cookie will only be available through a secured connection
     */
    public static set(name: string, value: string, expires?: number, path?: string, domain?: string, secure?: boolean) {
        let cookieStr = encodeURIComponent(name) + '=' + encodeURIComponent(value) + ';';

        if (expires) {
            let dtExpires = new Date(new Date().getTime() + expires * 1000 * 60 * 60 * 24);
            cookieStr += 'expires=' + dtExpires.toUTCString() + ';';
        }
        if (path) {
            cookieStr += 'path=' + path + ';';
        }
        if (domain) {
            cookieStr += 'domain=' + domain + ';';
        }
        if (secure) {
            cookieStr += 'secure;';
        }

        // console.log(cookieStr);
        document.cookie = cookieStr;
    }

Answer 3

I think that you should add a map entry into your SystemJS configuration file. Something like that:

<script>
  System.config({
    defaultJSExtensions: true,
    map: {
      "ng2-cookies": 'node_modules/ng2-cookies'
    },
    packages: {
      (...)
    }
  });
</script>

Answer 4

Try using this.

import { Cookie }` from `'ng2-cookies/ng2-cookies';

Cookie.set('ticket_status', responses.data.ticket);