将AngularJS表单提交到链接的Mongoose模型

时间:2018-06-21 04:53:23

标签: javascript angularjs node.js meanjs

我正在使用mean.js,并且想要创建两种形式。一个用于网站,另一个用于网站页面模板。

网站API POST路由为/api/websites

页面模板API的POST路由为/api/websites/:websiteId/page-templates

网站模型 modules/websites/server/models/website.server.model.js

var WebsiteSchema = new Schema({
  name: {
    type: String,
    default: '',
    required: 'Please fill Website name',
    trim: true
  },
  domain: {
    type: String,
    required: 'Please fill a correct domain name',
    trim: true
  },
  active: {
    type: Boolean,
    default: true,
    required: true
  },
  country: {
    type: String,
    required: true
  },
  created: {
    type: Date,
    default: Date.now
  },
  user: {
    type: Schema.ObjectId,
    ref: 'User'
  }
});

页面模板模型modules/websites/server/models/page-template.server.model.js

var PageTemplateSchema = new Schema({
  website: {
    type: Schema.ObjectId,
    required: 'Website object not found'
  },
  template_name: {
    type: String,
    trim: true,
    required: 'Please enter template name'
  },
  art_name_dom: {
    type: String,
    trim: true
  },
  active: {
    type: Boolean,
    default: true,
    required: true
  },
  created: {
    type: Date,
    default: Date.now
  },
  user: {
    type: Schema.ObjectId,
    ref: 'User'
  }
});

网站的角度表单工作正常,但页面模板表单上显示错误

页面模板表单modules/websites/client/views/page-templates/form-page-template.client.view.html的片段

...
 <p class="card-description">Website: <a href="{{vm.website.domain}}" target="_blank">{{vm.website.name}}</a></p>
 <form name="vm.form.pageTemplateForm" class="forms-sample" ng-submit="vm.save(vm.form.pageTemplateForm.$valid)"
              novalidate>
...

控制器 modules/websites/client/controllers/page-templates/page-templates.client.controller.js

angular
    .module('websites')
    .controller('PageTemplatesController', PageTemplatesController);

  PageTemplatesController.$inject = ['$scope', '$state', '$window', 'Authentication', 'websiteResolve', 'pageTemplateResolve', 'Notification'];

  function PageTemplatesController($scope, $state, $window, Authentication, website, pageTemplate, Notification) {
    var vm = this;

    vm.authentication = Authentication;
    vm.page_template = pageTemplate;
    vm.website = website;
    vm.error = null;
    vm.form = {};
    vm.save = save;

    // Save Website
    function save(isValid) {
      if (!isValid) {
        $scope.$broadcast('show-errors-check-validity', 'vm.form.pageTemplateForm');
        return false;
      }

      vm.page_template.createOrUpdate()
        .then(successCallback)
        .catch(errorCallback);

      function successCallback(res) {
        $state.go('websites.view'); // should we send the User to the list or the updated Article's view?
        Notification.success({ message: '<i class="glyphicon glyphicon-ok"></i> Article saved successfully!' });
      }

      function errorCallback(res) {
        Notification.error({ message: res.data.message, title: '<i class="glyphicon glyphicon-remove"></i> Article save error!' });
      }
    }
  }

网站表单运行正常。错误与页面模板表单一起出现。据我了解,页面模板表单无法引用要存储的网站。

在提交表单时遇到此错误

error on page template form submission

1 个答案:

答案 0 :(得分:0)

我必须像这样定位Angular的$resource对象,并手动定义查询方法的URL

function PageTemplatesService($resource, $log) {
    var PageTemplate = $resource('/api/websites/:websiteId/page-template/:pageTemplateId', {
      pageTemplateId: '@_id',
      websiteId: '@_id'
    }, {
      save: {
        url: '/api/websites/:websiteId/page-templates',
        method: 'POST'
      },
      query: {
        url: '/api/websites/:websiteId/page-templates'
      },
      update: {
        method: 'PUT'
      }
    });
....