Thinkster MEAN堆栈教程,删除元素

时间:2015-11-30 15:07:54

标签: angularjs json mean-stack

我一直在关注Thinkster Mean Stack教程,它运行得非常好。所以我创建了自己的项目,到目前为止一切正常。 但是,他们没有介绍如何删除帖子。 我可以为我的生活找不到如何从数据中删除元素。

AngularApp.js

var app = angular.module('KOL', ['ui.router'])
    .config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
        $stateProvider
            .state('home', {
                url: '/home',
                templateUrl: "/views/home.ejs",
                controller: 'kolCtrl',
                resolve: {
                        patientPromise: ['patients', function(patients) {
                            return patients.getAll();
                        }]
                    }
            })
            .state('details', {
                url: '/details/{id}',
                templateUrl: './views/details.html',
                controller: 'detailsCtrl'
            });

            $urlRouterProvider.otherwise('home');
    }])
    .factory('patients', ['$http', function($http){
        var object = {
        patients: []               

       };

        object.getAll = function() {
            return $http.get('/patients').success(function(data) {
                angular.copy(data, object.patients);
            });
        }

        object.create = function(patient) {
        return $http.post('/patients', patient).success(function(data){
            object.patients.push(data);
        });
    }


    };
        return object;
    }])
    .controller('kolCtrl', ['$scope', 'patients', 
        function($scope, patients){

              $scope.patients = patients.patients;
              $scope.selectedItem = $scope.patients[0];


              $scope.addPost = function() {
                if(!$scope.title || $scope.title === '') { return; }
                if(!$scope.age || $scope.age === '') { return; }
                patients.create({
                    name: $scope.title,
                    age: $scope.age,
                })

                $scope.title = '';
                $scope.age = '';

              };



              object.delete = function(patient)            

    }])
    .controller('detailsCtrl', [
        '$scope',
        '$stateParams',
        'patients',
        function($scope, $stateParams, patients){


        $scope.patient = patients.patients[$stateParams.id];
    }])


;

Home.ejs

<div class="container">
        <div clas="row">

            <div style="width: 200px; margin-top: 100px">
            <select  ng-model="selectedItem" ng-options="patients.name for patients in patients" class="pull-left form-control" name="Vælg"></select>
            </div>
            <div class="viewbox pull-right">
                <h3>Patient: {{selectedItem.name}}</h3>
                <p>Age: {{selectedItem.age}} </p>
                <p>index: {{patients.indexOf(selectedItem)}}</p>
                <button><a href="#/details/{{patients.indexOf(selectedItem)}}">Rediger</a></button>
                <button ng-click="deleteItem(patients.indexOf(selectedItem))">Delete</button>
            </div>





        </div>
        <div class="row" class="pull-left">
            <div style="width: 200px; margin-top: 100px">
            <form  role="form" class="form-group" ng-submit="addPost()">
                <input  class="form-control" type="text" ng-model="title" />
                <input  class="form-control" type="text" ng-model="age" />
                <button type="submit">Add</button>
            </form>
            </form>
        </div>
     </div>
     </div>

index.js(路线获取和发布)

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



/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

var mongoose = require('mongoose');
var Patient = mongoose.model('Patient');

router.get('/patients', function(req, res, next) {
  Patient.find(function(err, patients){
    if(err){ return next(err); }

    res.json(patients);
  });
});

router.post('/patients', function(req, res, next) {
  var patient = new Patient(req.body);

  patient.save(function(err, post){
    if(err){ return next(err); }

    res.json(patient);
  });
});

router.delete('/patients/:patient', function(req, res, next) {
    req.patient.remove(function(err, patient){
      if (err) { return next(err); }
      res.json(patient);
    });
});

router.param('patient', function(req, res, next, id) {
  var query = Patient.findById(id);

  query.exec(function (err, patient){
    if (err) { return next(err); }
    if (!post) { return next(new Error('can\'t find patient')); }

    req.patient = patient;
    return next();
  });
});

router.get('/details/:patient', function(req, res) {
  res.json(req.patient);
});

module.exports = router;

考虑到其他代码,我怀疑答案非常简单,但也许不是吗? 谢谢。

2 个答案:

答案 0 :(得分:1)

根据您的功能,您要传递到output[i,2]文件中的router.delete

index.js

router.delete('/patients/:patient', function(req, res, next) { req.patient.remove(function(err, patient){ if (err) { return next(err); } res.json(patient); }); }); 动词与patients.id服务一起使用时,您必须将delete附加到网址。因此,您可以在患者工厂的对象中添加$http方法:

delete

答案 1 :(得分:0)

 object.delete = function(patient) {
        return $http.delete('/patients', patient).success(function(data){
            for(var i = 0; i < object.patients.length; i++) {
                if(object.patients[i].id == patient.id) {
                    object.patients.splice(i, 1);
                }
        });

这样的事情可能很难说,如果不知道回应。如果响应(数据)是已删除的患者,那么您可以使用&#34; if(object.patients [i] .id == data .id)&#34;代替