Показать разные компоненты Angular 6 с данными из MongoDB на одной странице - PullRequest
0 голосов
/ 05 сентября 2018

У меня есть простой SPA, написанный на Angular 6, который использует MongoDB в качестве источника данных, и мне нужно составить страницу, на которой будут отображаться несколько компонентов с данными из разных коллекций.

Имеет список моделей и простой набор маршрутов.

Мой образец модели:

'use strict'

const mongoose = require('mongoose');

const emailsSchema = new mongoose.Schema(
    {
        HREF: { type: String, required: true, default: "" },
        value: { type: String, required: true, default: "" }
    },
    { collection: 'emails' }
);

module.exports = mongoose.model('emails', emailsSchema);

Мой routes.js:

'use strict'

const express = require('express');
const router = express.Router();

const models = [
    require('../models/emails')
]

/**
 * collection find wrapper
 * @param {Model} model mongodb model
 * @param {Response} res response object
 * @param {NextFunction} next next function handler
 */
const find = (model, res, next) => {
    model.find((err, entries) => {
        if (err)
            return next(err);

        res.json(entries);
    })
}

router.get('/', (req, res, next) => {
    res.json([]);
});

for (let model of models) {
    router.get(`/${model.modelName}`, (req, res, next) => {
        find(model, res, next);
    });
}

module.exports = router;

Образец услуги:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class CommonService {
  constructor(private http: HttpClient) { }

  getEmails = () => (this.http.get('db/emails'));
}

Образец компонента:

import { Component, OnInit, Input } from '@angular/core';
import { CommonService } from '../common.service';
import { Emails } from '../Models';

@Component({
  selector: 'app-compose',
  templateUrl: './compose.component.html',
  styleUrls: ['./compose.component.less']
})
export class ComposeComponent implements OnInit {
  emails: Emails[] = [];

  constructor(public service: CommonService) { }

  ngOnInit() {
    this.service.getEmails().subscribe((data) => this.emails = <Emails[]>data || []);
  }
}

Вот вопрос:

Можно ли продолжать использовать ng serve и каким-то образом реализовать этот код?

Потому что, как и сейчас, он выдает ошибку 404, пока служба пытается загрузить данные с заданного пути, так как node.js не знает о моих маршрутах и ​​обо всем, что происходит при запуске с помощью команды ng.

Или я должен всегда компилировать свой код и запускать сервер узлов вручную?

PS

Я знаю о маршрутизации в Angular, и все мои компоненты работают отлично, в то время как у каждого из них есть свой собственный путь.

Но в этом случае мне нужно открыть путь, подобный этому http://my.site.com/, и показать набор различных компонентов, каждый из которых должен считывать данные из предопределенной коллекции MongoDB.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...