{title: "An error occured", error: {errors: {user: {,…}}, _message: "Guide validation failed",…}}

Body.prototype.json = function () {
        if (typeof this._body === 'string') {
            return JSON.parse(/** @type {?} */ (this._body));
        }
        if (this._body instanceof ArrayBuffer) {
            return JSON.parse(this.text());
        }
        return this._body;

import { GuideService } from '../guide/guide.service';
import { Component, OnInit } from '@angular/core';
import { Guide } from '../guide/guide.model';
import { Form, FormArray, FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { User } from '../auth/user.model';
import { GuideResource } from '../create-guide/guide-resource/guide-resource.model';
import { Observable } from 'rxjs/Rx';


@Component({
  selector: 'app-create-guide',
  templateUrl: './create-guide.component.html',
  styleUrls: ['./create-guide.component.css']
})
export class CreateGuideComponent implements OnInit {

  rform: FormGroup;

  constructor(private fb: FormBuilder, public guideService: GuideService) {
  }



  save(model: FormGroup) {
    const newGuide = new Guide(
      model.value.title,
      model.value.description,
      model.value.prereqs,
      model.value.experienceLevel,
      model.value.guideResources,
      new User('User', 'Meme team', 'user@gmail.com', 'guide')
    );
    this.guideService.addGuide(newGuide)
      .subscribe(
        data => console.log(data),
        error => console.error(error)
      );

  }

  initGuideResource() {
      return this.fb.group({
        resourceTitle: [null, Validators.compose([Validators.required])],
        resourceLink: [null, Validators.compose([Validators.required])],
        resourceTime: [null, Validators.compose([Validators.required])],
        resourceContent: [null, Validators.compose([Validators.required])]
      });
  }

    addGuideResource() {
      // add guide to the list
      const control = <FormArray>this.rform.controls['guideResources'];
      control.push(this.initGuideResource());
  }

    removeGuideResource(i: number) {
      // remove guide from the list
      const control = <FormArray>this.rform.controls['guideResources'];
      control.removeAt(i);
  }

  ngOnInit() {
    this.rform = this.fb.group({
      title : [null, Validators.compose([Validators.required])],
      description : [null, Validators.compose([Validators.required])],
      prereqs: [null, Validators.compose([Validators.required])],
      experienceLevel: [null, Validators.required],
      guideResources: this.fb.array([
        this.initGuideResource()
      ])

    });
  }



}

<form [formGroup]="rform" (ngSubmit)="save(rform)">
    <div class="container mt-5">
        <div class="form-group">
            <h1 style="text-align:center">Create a guide</h1>

            <label class="mt-4">Title</label>
            <input type="text" class="form-control" formControlName="title">

            <label class="mt-4">Description</label>
            <textarea id="description" type="text" class="form-control" formControlName="description"></textarea>

            <label class="mt-4">Required prerequisite knowledge</label>
            <textarea id="prereqs" type="text" class="form-control" formControlName="prereqs"></textarea>

            <label class="mt-4">What should their experience level be before starting this guide? (Beginner, Intermediate, Advanced)</label>
            <select class="form-control" formControlName="experienceLevel">
              <option value="Beginner">Beginner</option>
              <option value="Intermediate">Intermediate</option>
              <option value="Advanced">Advanced</option>
            </select>

            <div formArrayName="guideResources">
                <div *ngFor="let resource of rform.controls.guideResources.controls; let i=index">
                    <div class="mt-5">
                        <span>Resource #{{i+1}}</span>
                        <span class=""><button class="btn btn-danger btn-sm" (click)="removeGuideResource(i)">Delete Resource</button></span>
                    </div>
                    <div [formGroupName]="i">
                        <app-guide-resource [guideResourceForm]=rform.controls.guideResources.controls[i]></app-guide-resource>
                    </div>
                </div>

                <div class="mt-3 mb-5">
                    <button class="btn btn-primary" (click)="addGuideResource()">Add Resource</button>
                </div>

            </div>

        </div>

        <button type="submit" class="btn btn-success form-control mb-5" [disabled]="!rform.valid">Submit Guide</button>

    </div>


</form>

import { NgForm } from '@angular/forms/src/directives';
import { Component, Input, OnInit } from '@angular/core';
import { GuideResource } from './guide-resource.model';
import { FormGroup, ReactiveFormsModule, FormBuilder } from '@angular/forms';


@Component({
  moduleId: module.id,
  selector: 'app-guide-resource',
  templateUrl: './guide-resource.component.html',
  styleUrls: ['./guide-resource.component.css']
})
export class GuideResourceComponent implements OnInit {

  @Input() guideResourceForm: FormGroup;

  constructor() { }

  ngOnInit() {}
}

<div [formGroup]="guideResourceForm">
    <div class="card">
        <div class="card-block">
            <div class="form-group col-xs-6">
                <label>Name of Resource</label>
                <input type="text" class="form-control" formControlName="resourceTitle">
                <!-- <small [hidden]="guideResourceForm.controls.resourceTitle.valid" class="text-danger">
            Name of Resource is not valid
        </small> -->
            </div>

            <div class="form-group col-xs-6 mt-3">
                <label>Where is this found? (URL only)</label>
                <input type="url" class="form-control" formControlName="resourceLink">
            </div>

            <div class="form-group col-xs-6 mt-3">
                <label>How long does it take to complete? (in hours)</label>
                <input type="number" class="form-control" formControlName="resourceTime">
                <!-- <small [hidden]="guideResourceForm.controls.resourceTime.valid" class="text-danger">
            Resource Time is not valid
        </small> -->
            </div>

            <div class="form-group col-xs-6 mt-3">
                <label>Resource Content (include everything you wish you knew when you started! Including common mistakes, sections to skip, etc.)</label>
                <input id="content" type="text" class="form-control" formControlName="resourceContent">
                <!-- <small [hidden]="guideResourceForm.controls.resourceContent.valid" class="text-danger">
            Name of Resource is not valid
        </small> -->
            </div>
        </div>
    </div>

</div>

import { Guide } from './guide.model';
import { Headers, Http, Response } from '@angular/http';
import {Injectable} from '@angular/core';
import 'rxjs/Rx';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class GuideService {
    constructor(private http: Http) {}

    addGuide(guide: Guide) {
        const body = JSON.stringify(guide);
        const headers = new Headers({'Content-Type': 'application/json'});
        const token = localStorage.getItem('token');
        return this.http.post('http://localhost:3000/create', body, {headers: headers})
            .map((response: Response) => response.json())
            .catch((error: Response) => Observable.throw(error.json));
    }
}

var express = require('express');
var Guide = require('../../models/guide');
var User = require('../../models/user')
var router = express.Router();


router.post('/create', function(req, res, next) {
    var guide = new Guide({
        title: req.body.title,
        description: req.body.title,
        prereqs: req.body.prereqs,
        experience: req.body.experience,
        guideResources: req.body.guideResources,
        dateCreated: Date.now(),
        user: new User({
            username: "User",
            password: "SupaSecret",
            email: "email@email.com"
        })
    });
    guide.save();
    res.redirect('/');
})


module.exports = router;