使用 angularJS 将数据嵌入到 Mongoose 模式中。平均堆栈

Question

我正在使用mean.js 中的 CRUD 模块将数据添加到我的 web 应用程序。

我在添加字符串等方面没有问题，但是我在嵌入数据方面遇到了问题。

我想要的数据格式如下。

{
    "_id":"5559abc02ef1bcdc2e6e6137",
    "messages": [
        "title":"title of msg",
        "msg":"msg content"
    ],
    "created":"2015-05-19T09:30:25.117Z",
    "department":"finance",
    "name":"accounts receivable"
}

通过这个 sn-p，我希望能够将数据推送到 messages 字段中。我在 pushing object into array schema in Mongoose 等帖子中看到了有关如何执行此操作的想法。

但是我不确定如何使用 Angular 实现这个解决方案。 到目前为止，我有以下内容，适用于除消息字段之外的所有字段。

    var mongoose = require('mongoose'),
        Schema = mongoose.Schema;

    /**
     * Team Schema
     */
    var TeamSchema = new Schema({
        name: {
            type: String, //eg accounts receivable
            default: '',
            required: 'Please fill Team name',
            trim: true
        },
        department: {
            type: String, //eg finance
            default: '',
            required: 'Please fill department',
            trim: true
        },
        messages: [
          {
            title: {type: String},
            msg: {type: String}
          }
        ],

        created: {
            type: Date,
            default: Date.now
        },
        user: {
            type: Schema.ObjectId,
            ref: 'User'
        }
    });

    /**
     * Create a Team
     */

    var mongoose = require('mongoose'),
        errorHandler = require('./errors.server.controller'),
        Team = mongoose.model('Team'),
        _ = require('lodash');

    exports.create = function(req, res) {
        var team = new Team(req.body);
        team.user = req.user;
        team.save(function(err) {
            if (err) {
                return res.status(400).send({
                    message: errorHandler.getErrorMessage(err)
                });
            } else {
                res.jsonp(team);
            }
        });
    };

    /**
     * Angular controller
     */

    $scope.create = function() {
        // Create new Team object
        var team = new Teams ({
            name: this.name,
            department: this.department,
            messages: this.messages.title
            //this.messages[0].title
        });

        // Redirect after save
        team.$save(function(response) {
            $location.path('teams/' + response._id);

            // Clear form fields
            $scope.name = '';
            $scope.department = '';
            $scope.messages.title = '';
        }, function(errorResponse) {
            $scope.error = errorResponse.data.message;
        });
    };

角度视图

    <form class="form-horizontal" data-ng-submit="create()" novalidate>
        <fieldset>
            <div class="form-group">
                <label class="control-label" for="name">Name</label>
                <div class="controls">
                    <input type="text" data-ng-model="name" id="name" class="form-control" placeholder="Name" required>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label" for="department">Department</label>
                <div class="controls">
                    <input type="text" data-ng-model="department" id="department" class="form-control" placeholder="Department" required>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label" for="messages">messages</label>
                <div class="controls">
                    <input type="text" data-ng-model="messages.title" id="messages" class="form-control" placeholder="messages">
                </div>
            </div>                
            <div class="form-group">
                <input type="submit" class="btn btn-default">
            </div>
            <div data-ng-show="error" class="text-danger">
                <strong data-ng-bind="error"></strong>
            </div>
        </fieldset>
    </form>

如何像保存其他项目一样保存消息标题和消息？

我还可能希望让用户能够将自己的字段添加到此消息字段，以便他们可以将自己的自定义添加到模型中，因此最好使用解决方案而不是明确提及标题和消息，而不是引用 each 项目。

Answer 1

您需要在 $scope.create 函数中创建一个消息数组，在创建新团队对象时是这样的：

// Create new Team object
var team = new Teams ({
    name: this.name,
    department: this.department,
    messages: [
        { title: this.messages.title, msg: "" }
    ]
});

为了添加具有不同标题等的多条消息，我会创建一个范围变量来保存消息（例如$scope.messages = [{title:"",msg:""}]），然后使用 ng-repeat 在模板中对其进行迭代以创建多个输入：

<input type="text" data-ng-repeat="message in messages" data-ng-model="message.title" id="messages" class="form-control" placeholder="messages">

然后，您可以有一个“添加消息”按钮，连接它单击以将另一个 {title:"",msg:""} 推送到 $scope.messages 数组。最后，您将再次更新 $scope.create 函数以将该数组添加为消息字段的值：

// Create new Team object
var team = new Teams ({
    name: this.name,
    department: this.department,
    messages: this.messages
});

在清除表单时，只需将 $scope.messages 设置回其初始单项数组值。