How to generate UUID with angular 2?

I'm using Angular 2 for a signup form:
first name, last name, email and password.

After submit, the data is being stored via API call in a database (nodeJs and mongo) and generates a JWT Token which is sent back to the client.

Now I should add/generate an UUID (Universal Unique Identifier). As I never have done this kind of feature before, I need an approach and idea/solution how to achieve this... would the JWT Token be a kind of alternative to UUID? If yes, this would be enough.

Otherwise I would prefer to avoid any big changes on the form or its functionality.

I Have been searching, but didn't find a useful solution. I tried the npm package angular2-uuid, but after installing it as dependency, the ng build -prod throws an error which isn't clear.

angular2-uuid

ng build -prod

import { UUID } from 'angular2-uuid';
....
let uuid = UUID.UUID();


Error:

ERROR in ./~/@angular/flex-layout/@angular/flex-layout.es5.js Module
build failed: Error: ENOENT: no such file or directory, open
'/Users/username/dev/app/node_modules/@angular/flex-
layout/@angular/flex-layout.es5.js' @
./src/$$_gendir/app/app.module.ngfactory.ts 25:0-44 @ ./src/main.ts @
multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

Any idea or Hint please?

throws an error which isn't clear

Any idea or Hint please?

ERROR in ./~/@angular/flex-layout/@angular/flex-layout.es5.js Module build failed: Error: ENOENT: no such file or directory, open '/Users/username/dev/app/node_modules/@angular/flex-layout/@angular/flex-layout.es5.js' @ ./src/$$_gendir/app/app.module.ngfactory.ts 25:0-44 @ ./src/main.ts @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

UUID

3 Answers
3

It is part of Angular, use it like:

import { v4 as uuid } from 'uuid';

@Component(..)
export class AppComponent {

console.log('new uid: ', uuid());
}


npm install --save @types/uuid

try this (https://github.com/wulfsolter/angular2-uuid)

https://github.com/wulfsolter/angular2-uuid

As the doc say :

import { UuidService } from 'angular2-uuid';

constructor(private uuid: UuidService) //<-- pass it in contructor as service

const uuid = this.uuid.generate(); //<-- use it


Hope it helps you! ..as you can see it changed a little bit from what it report here (https://www.npmjs.com/package/angular2-uuid)

[ts] Module '"/Users/username/dev/app/node_modules/angular2-uuid/index"' has no exported member 'UuidService'.

add.module.ts

...has no exported memebr

Issue fixed. Solution: I found out that when I did install the package angular2-uuid via command-line, it was automatically stored in package.json directly before/over the package: @angular/flex-layout.

angular2-uuid

package.json

@angular/flex-layout

As the error was in a way not clear, I just did remove it to other position in the: package.json and the error is gone. everything works fine.

package.json

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.