MEAN 2 Multi Tenant App. Form to create 2 different models - angularjs

Question

In my quest to learn the MEAN stack i'm building a small multi tenanted app and struggling with getting my users / tenants all signed up. Backend is sorted I believe just cant quite figure out how to get angular to play ball.
Flow... User signs up a new account, Which concurrently creates a new tenant. Like so...
var express = require('express');
var router = express.Router();
var bcrypt = require('bcryptjs');
var Tenant = require('../models/tenant');
var User = require('../models/user');
router.post('/', function (req, res, next) {
var tenant = new Tenant({
name: req.body.name
});
tenant.save(function(err, tenant) {
Tenant.findById(tenant._id, function(err, tenant) {
var user = new User({
first_name: req.body.first_name,
last_name: req.body.last_name,
email: req.body.email,
password: bcrypt.hashSync(req.body.password, 10),
active: req.body.active,
tenant: tenant
})
user.save(function (err, user) {
if (err) {
return res.status(500).json({
title: 'An error has occured',
error: err
});
}
res.status(201).json({
message: 'User created',
obj: user
});
})
});
});
// tenant.findByIdAndUpdate(tenant._id, {owner: user._id});
});
module.exports = router;
This, for the most part, works as intended. At least in testing with postman.
In angular my signup component (in its working state before I tried introducing tenants) looks like:
import { Component, OnInit } from '#angular/core';
import {FormControl, FormGroup, Validators} from "#angular/forms";
import {Router} from "#angular/router";
import {AuthService} from "../auth.service";
import {User} from "../user.model";
import {Tenant} from "../tenant.model";
#Component({
selector: 'app-signup',
templateUrl: './signup.component.html',
styleUrls: ['./signup.component.css']
})
export class SignupComponent implements OnInit{
myForm: FormGroup;
constructor(private router: Router, private authService: AuthService) {}
onSubmit() {
const user = new User(
this.myForm.value.first_name,
this.myForm.value.last_name,
this.myForm.value.email,
this.myForm.value.password
);
this.authService.signup(user)
.subscribe(
data => console.log(data),
error => console.error(error)
);
this.router.navigate(['/signup/success/' + this.myForm.value.email]);
}
ngOnInit() {
this.myForm = new FormGroup({
coName: new FormControl('', Validators.required),
email: new FormControl('', Validators.required),
password: new FormControl('', Validators.required),
active: new FormControl(true, Validators.required)
});
}
}
and my AuthService (again in its working state before i tried introducing tenants) ...
import { Injectable } from "#angular/core";
import { Http, Headers, Response } from "#angular/http";
import 'rxjs/Rx';
import { Observable } from "rxjs";
import { User } from "./user.model";
import { Tenant } from "./tenant.model";
#Injectable()
export class AuthService {
constructor(private http: Http) {}
signup(user: User) {
const body = JSON.stringify(user);
const headers = new Headers({'Content-Type': 'application/json'});
return this.http.post('/api/tenant', body, {headers: headers})
.map((response: Response) => response.json())
.catch((error: Response) => Observable.throw(error.json()));
}
signin(user: User) {
const body = JSON.stringify(user);
const headers = new Headers({'Content-Type': 'application/json'});
return this.http.post('/api/user/signin', body, {headers: headers})
.map((response: Response) => response.json())
.catch((error: Response) => Observable.throw(error.json()));
}
logout() {
localStorage.clear();
}
isLoggedIn() {
return localStorage.getItem('token') !== null;
}
}
Now, i'm not looking for a handout, or anyone to write this for me... just a friendly nudge in the right direction, if that's allowed on here ;) . Would it be easier to just abandon the reactive form and use ngModel? Or perhaps, define a new angular model that is a hybrid of user/tenant?
Cheers.

Answer 1

In case anyone sees this and cares... I was putting a level of importance on my angular models mimicking my mongoose models. I ended up creating a new angular model (signup.model.ts) made up of the relevant fields from both my tenant and user mongoose models. Now I'm not sure this was necessarily the ideal way to structure this, however it works so feel I can put it in as an answer.
Cheers.