Question

我有这样的问题。我在其中创建了一个平均堆栈应用程序，并在其中创建了发布新闻选项。为此，我使用了ngx-editor。这是放置编辑器的component.html文件。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<body class="fixed-nav sticky-footer bg-dark" id="page-top">
<!-- Navigation-->
<app-adminnavbar></app-adminnavbar>
<div class="content-wrapper">
  <div class="container-fluid">
    <form (submit)="putNews()">
      <app-ngx-editor [placeholder]="'Enter text here...'" [spellcheck]="true" name="htmlContent" [(ngModel)]="htmlContent" minHeight="50px" Width="50px" ></app-ngx-editor>
      <br>
      <button type="submit" class="btn btn-success">Post News</button>
    </form>
  </div>

  <app-adminfooter></app-adminfooter>

  <a class="scroll-to-top rounded" href="#page-top">
    <i class="fa fa-angle-up"></i>
  </a>

</div>
</body>

与此新闻component.html相关联的我的component.ts文件

import { Component, OnInit } from '@angular/core';
import { BootstrapAlertService, BootstrapAlert } from 'ngx-bootstrap-alert';
import { NewsService} from '../../shared/news.service';
import {News} from "../../shared/news";


@Component({
  selector: 'app-news',
  templateUrl: './news.component.html',
  styleUrls: ['./news.component.css'],
  providers: [NewsService]
})
export class NewsComponent implements OnInit {

  public news:News = new News();
  htmlContent: any;
  constructor(private newsService: NewsService,private bootstrapAlertService:BootstrapAlertService) { }

  ngOnInit() {
  }

  putNews(){
    this.news.content=this.htmlContent;
    this.newsService.putNews(this.news).subscribe((res)=>{
      console.log(res);
    });
  }

}

我在这里提供新闻服务文件和新闻类文件。

import { Injectable } from '@angular/core';
import {News} from "./news";
import { HttpClient , HttpHeaders } from '@angular/common/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';

@Injectable()
export class NewsService {

  public selectedNews:News = new News();
  public news:News[];

  constructor(private http: HttpClient) { }


  putNews(news:News){
    let headers = new HttpHeaders();
    headers.append('Content-Type', 'application/json');
    return this.http.post('http://localhost:3000/news/create', news, {headers: headers});
  }
}


export class News {
  public content:string;
}

这是后端的index.js文件的外观。

const express = require('express');
const  bodyParser = require('body-parser');
const passport = require('passport');
const cors = require('cors');

const path = require('path');

var app = express();
const config = require('./db.js');
require('./config/passport')(passport);

var userController = require('./controllers/userController');
var reservationController = require('./controllers/reservationController');
var mailController = require('./controllers/mailController');
var newsController = require('./controllers/newsController');

app.use(bodyParser.urlencoded({extended: false}));
app.use(bodyParser.json());
app.use(passport.initialize());
app.use(passport.session());
app.use(cors({ origin: 'http://localhost:4200'}));



app.listen(3000, function ( ) {
    console.log('Server started at port : 3000')
});

app.use('/user', userController);
app.use('/reservation', reservationController);
app.use('/mail', mailController);
app.use('/news', newsController);

这是我在节点外观中的新闻控制器。

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

var  News  = require('../models/news');

router.post("/create",function (req,res) {
    console.log(req.body.content);
    const newNews = new News({
        content: req.body.content,
    });

    News.saveNews(newNews, function (err, news) {
        if (news) {
            res.send(news);
        }

        else {
            console.log('Error in User save :' + JSON.stringify(err, undefined, 2));
        }
    });

});


module.exports = router;

这是我用来处理新闻的我的节点js模型，

const mongoose = require('mongoose');
const schema = mongoose.Schema;

const newsSchema = new schema({
    content:{type:String, required:true},
});

const News = module.exports= mongoose.model("News",newsSchema );


module.exports.saveNews = function (newNews, callback) {
    newNews.save(callback);
}

但是，当我按下“提交”按钮和console.log时，HTML内容的值它正确给出了输出。但是，当我将其发送到后端时，它在控制台窗口中显示错误，并在一秒钟内消失。有人可以帮助我改进代码，以将编辑器的HTML内容正确发送到数据库吗？

谢谢！

无法正确获取角度编辑器的数据

0 个答案: