2015-06-28 4 views
-1

У меня есть функция approveArticle(art) под названием с точки зрения следующим образом:Угловые изменения не сохраняются в модели

<td> 
    <a href="#" class="btn btn-success disabled" ng-show="art.approved">Approved</a> 
    <a href="#" class="btn btn-info" ng-click="article.approveArticle(art)" ng-show="!art.approved">Approve</a> 
</td> 

(здесь article является контроллером и art приходит из следующего нг-повтора: <tr ng-repeat="art in article.articles">

функция в контроллере выглядит следующим образом:

vm.approveArticle = function (art) { 
    art.approved = true; 
}; 

точки зрения изменения как ожидат ted, после нажатия кнопки «Одобрить» заменяется отключенной кнопкой «Approved». Однако изменения не сохраняются в базе данных (я проверял с Robomongo - также, после обновления, одобрения исчезли).

Как сохранить эти изменения в модели? Помогите оценить.

ArticleSchema:

var ArticleSchema = new Schema({ 
    title: { type: String }, 
    author: { type: String }, 
    body: { type: String }, 
    comments: [{ 
     body: { type: String }, 
     date: { type: Date } 
    }], 
    approved: { type: Boolean }, 
    created_at: { type: Date }, 
    updated_at: { type: Date } 
}); 

GET и PUT маршруты для статьи:

articleRouter.route('/articles/:article_id') 
    .get(function (req, res) { 
     Article.findById(req.params.article_id, function (err, article) { 
      if (err) { 
       res.send(err); 
      } 
      res.json(article); 
     }); 
    }) 
    .put(function (req, res) { 
     Article.findById(req.params.article_id, function (err, article) { 
      if (err) { 
       res.send(err); 
      } 
      if (req.body.title) { 
       article.title = req.body.title; 
      } 
      if (req.body.author) { 
       article.author = req.body.author; 
      } 
      if (req.body.body) { 
       article.body = req.body.body; 
      } 
      if (req.body.date) { 
       article.date = req.body.date; 
      } 
      if (req.body.hidden) { 
       article.hidden = req.body.hidden; 
      } 
      article.save(function (err) { 
       if (err) { 
        res.send(err); 
       } 
       res.json({ message: 'Article updated!' }); 
      }); 
     }); 
    }); 

articleController:

.controller('articleController', function (Article) { 
    'use strict'; 
    var vm = this; 
    vm.processing = true; 
    Article.all() 
     .success(function (data) { 
      vm.processing = false; 
      vm.articles = data; 
     }); 
    vm.deleteArticle = function (id) { 
     if (confirm("You are about to delete an article!")) { 
      vm.processing = true; 
      Article['delete'](id) 
       .success(function (data) { 
        Article.all() 
         .success(function (data) { 
          vm.processing = false; 
          vm.articles = data; 
         }); 
       }); 
     } 
    }; 
    vm.approveArticle = function (art) { 
     art.approved = true; 
    }; 
}); 

articleEditController: (у меня есть ощущение, что ЧТ это может быть весьма актуально)

.controller('articleEditController', function ($routeParams, Article) { 
    'use strict'; 
    var vm = this; 
    vm.type = 'edit'; 
    Article.get($routeParams.article_id) 
     .success(function (data) { 
      vm.articleData = data; 
     }); 
    vm.saveArticle = function() { 
     vm.processing = true; 
     vm.message = ''; 
     Article.update($routeParams.article_id, vm.articleData) 
      .success(function (data) { 
       vm.processing = false; 
       vm.articleData = {}; 
       vm.message = data.message; 
      }); 
    }; 
}); 

articleService.js, содержащее соответствующие заводы:

angular 
    .module('articleService', []) 
    .factory('Article', function ($http) { 
     'use strict'; 

     var articleFactory = {}; 

     articleFactory.get = function (id) { 
      return $http.get('/api/article/articles/' + id); 
     }; 

     articleFactory.all = function() { 
      return $http.get('/api/article/articles/'); 
     }; 

     articleFactory.create = function (articleData) { 
      return $http.post('/api/article/articles/', articleData); 
     }; 

     articleFactory.update = function (id, articleData) { 
      return $http.put('/api/article/articles/' + id, articleData); 
     }; 

     articleFactory['delete'] = function (id) { 
      return $http['delete']('/api/article/articles/' + id); 
     }; 

     return articleFactory; 
    }); 
+2

У вас должен быть код, который фактически отправляет или иным образом отправляет данные на сервер. Вы делаете это где угодно? –

+0

@SunilD. Я не. Я попробовал несколько идей, но все они вызвали ошибку в терминале. Я думаю, что функция 'approveArticle' не должна заканчиваться назначением, но я не знаю, как я мог ее сохранить. – zcserei

+0

@SunilD. то, что я пробовал больше всего, это репликация функции обновления, которую я использую для своего редактирования, но этого не делал. – zcserei

ответ

0

я понял, что я только изменить свойство на стороне клиента, ничего не меняя на сервере. Я придумал следующее.

Я добавил approve метод к Article модели, следующим образом:

ArticleSchema.methods.approve = function (cb) { 
    'use strict'; 
    this.approved = true; 
    this.save(cb); 
}; 

Затем я создал маршрут API для утверждения статьи:

articleRouter.route('/articles/:article_id/approve') 
    .put(function (req, res) { 
     Article.findById(req.params.article_id, function (err, article) { 
      article.approve(function (err, article) { 
       if (err) { 
        res.send(err); 
       } 
       res.json({ message: 'Article approved' }); 
      }); 
     }); 
    }); 

Затем я создал основной вызов на моем заводе, чтобы я мог повторно использовать код:

articleFactory.approve = function (id) { 
    return $http.put('/api/article/articles/' + id + '/approve'); 
}; 

Наконец, Я переписал функцию в контроллере, следующим образом:

vm.approveArticle = function (art) { 
    if (confirm("You are about to approve an article!")) { 
     Article.approve(art._id) 
      .success(function (data) { 
       flash.success = 'Article approved!'; 
       art.approved = true; 
      }); 
    } 
}; 

Здесь я звоню метод утверждать так, что PUT вызов направляется в API. После успеха я запускаю флеш-сообщение (используя angular-flash) и изменяя состояние текущего объекта, чтобы представление моментально отражало изменения.

Я не уверен в последней части (возможно, есть более хороший способ, чем art.approved = true;), но это работает так, как я предполагал.

Смежные вопросы