MEAN 2 多租户应用程序。创建 2 个不同模型的表单

Question

为了学习 MEAN 堆栈，我正在构建一个小型多租户应用程序，并努力让我的用户/租户全部注册。后端已排序，我相信只是不太清楚如何让 angular 玩球。

Flow... 用户注册一个新帐户，同时创建一个新租户。像这样...

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;

在大多数情况下，这可以按预期工作。至少在邮递员测试中。

在 angular 中，我的注册组件（在我尝试介绍租户之前处于工作状态）看起来像：

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)
    });
  }

}

和我的 AuthService（在我尝试引入租户之前再次处于工作状态）...

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;
  }
}

现在，我不是在寻找讲义，也不是在寻找任何人为我写这篇文章...只是在正确的方向上进行友好的推动，如果这里允许的话;)。放弃反应式形式并使用 ngModel 会更容易吗？或者，定义一个新的 angular 模型，它是 user/tenant?

的混合体

干杯。

Answer 1

以防万一有人看到并关心...我对模仿我的猫鼬模型的 angular 模型给予了一定程度的重视。我最终创建了一个新的 angular 模型 (signup.model.ts)，它由来自我的租户和用户猫鼬模型的相关字段组成。现在我不确定这是否一定是构建它的理想方式，但它确实有效，所以我觉得我可以把它作为答案。

干杯。

MEAN 2 多租户应用程序。创建 2 个不同模型的表单

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

multi-tenant

angularjs

mean-stack

angular4-forms