Angular, Automate user page creation

Question

currently I'm building a web app. I have been following a guide that incorporates data to localstorage. Currently I can register. However now I want to be able to create a public html page for that person at the same time. the user instance contains things like email and username etc.

function register() {
            const user = body

            if (users.find(x => x.username === user.username)) {
                return error('Username "' + user.username + '" is already taken')
            }

            user.id = users.length ? Math.max(...users.map(x => x.id)) + 1 : 1;
            users.push(user);
            localStorage.setItem('users', JSON.stringify(users)); //////

            return ok();
        }

where I've added the //////. Is there any way to grab this data and automatically create a html page with the newly registered data? I've created links to these pages but I'm hoping there is a method to add a new page, like a personal home page.

The html pages should be named users/${id}.

Thanks, any help is appreciated.

Answer 1

If I understood correctly, you want to navigate the user to the dashboard creating the account.

For this, you will need to create a component that will act as a page, and define a route to it that can accept the ID as a parameter, something like:

{ path: 'users/:id', component: DashboardComponent }

So after the user create his account, you can navigate him to users/ID which will show the DashboardComponent that will use this ID to get his unique properties and display it to the user.

router.navigate(['/users', id]); or [routerLink]="['/users', user.id]"

You can find all the info you need for the routing here: https://angular.io/guide/router

Another good tutorial for route params here: https://angular-2-training-book.rangle.io/routing/routeparams