将angularjs与节点api集成？

Question

我的节点路由如下

// BASE SETUP
// =============================================================================

// call the packages we need
var express    = require('express');        // call express
var app        = express();                 // define our app using express
var bodyParser = require('body-parser');

//var morgan = require('morgan');             // log requests to the console (express4)
//var bodyParser = require('body-parser');    // pull information from HTML POST (express4)
var methodOverride = require('method-override');
var fs = require('fs');

// configure app to use bodyParser()
// this will let us get the data from a POST
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

var port = process.env.PORT || 8080;        // set our port

// ROUTES FOR OUR API
// =============================================================================
var router = express.Router();              // get an instance of the express Router

var mongoose   = require('mongoose');

mongoose.connect('mongodb://localhost/test');

var User    = require('./models/users');
var Dummy    = require('./models/dummycar');

//app.use(express.static(__dirname + '/'));                 // set the static files location /public/img will be /img for users
//app.use(morgan('dev'));                                         // log every request to the console
app.use(bodyParser.urlencoded({'extended':'true'}));            // parse application/x-www-form-urlencoded
app.use(bodyParser.json());                                     // parse application/json
app.use(bodyParser.json({ type: 'application/vnd.api+json' })); // parse application/vnd.api+json as json
app.use(methodOverride());


// get users list

    app.get('/api/users',function(req, res) {
        User.find(function(err, users) {
            if (err)
                res.send(err);

            res.json(users);
        });
    });


//create users

    app.post('/api/users', function(req, res) {

        var user = new User();
        user.username = req.body.username;
        user.password = req.body.password;


        user.save(function(err) {
            if (err)
                res.send(err);

            User.find(function(err, users) {
                if (err)
                    res.send(err);
                res.json(users);
            });

        });
    });



//create cars

    app.post('/api/cars', function(req, res) {

        var dummy = new Dummy();
        dummy.name = req.body.name;
        dummy.brand = req.body.brand;
        dummy.class = req.body.class;
        dummy.price = req.body.price;
        dummy.available = req.body.available;



        dummy.save(function(err) {
            if (err)
                res.send(err);
            res.send("sucess");

        });
    });

//list cars

    app.get('/api/cars',function(req, res) {
        Dummy.find(function(err, dummys) {
            if (err)
                res.send(err);

            res.json(dummys);
        });
    });




//list cars by available

app.get('/api/cars/available',function(req, res) {
    Dummy.find({available:'true'},function(err, dummys) {
        if (err)
            res.send(err);

        res.json(dummys);
    });
});


// list cars by class


    app.get('/api/cars/:classtype',function(req, res) {
       Dummy.find({class:req.params.classtype}, function(err,dummys) {
            if (err)
                res.send(err);
            res.json(dummys);
        });


    });


// list cars by price

    app.get('/api/cars/price/:startvalue/:endvalue',function(req, res) {
        Dummy.find({price:{$gte:req.params.startvalue,$lte:req.params.endvalue}}, function(err,dummys) {
            if (err)
                res.send(err);
            res.json(dummys);
        });


    });


// booking option by sending date and name


    app.get('/api/cars/book/:nametype',function(req, res) {


        Dummy.findOne({name:req.params.nametype}, function(err, dummy) {

            if (err)
                res.send(err);

            dummy.available = false;


            dummy.save(function(err) {
                if (err)
                    res.send(err);

                res.send("updated");
            });

        });
    });


// user authentication

    app.get('/api/users/:usernametype/:passwordtype',function(req, res) {

        User.findOne({$and:[{username:req.params.usernametype},{password:req.params.passwordtype}]}, function(err, user) {
            if (err)
                res.send(err);
            else {
                if (user == null)
                    res.send(false);
                else
                    res.send(true);
            }

        });
    });







// REGISTER OUR ROUTES -------------------------------
// all of our routes will be prefixed with /api
//app.use('/api', router);

// application -------------------------------------------------------------

   app.get('*', function(req, res) {
        res.sendfile('./view/intro.html'); // load the single view file (angular will handle the page changes on the front-end)
    });

// START THE SERVER
// =============================================================================
app.listen(port);
console.log('server running on  ' + port);

我的模特是

//dummycar.js
var mongoose     = require('mongoose');
var Schema       = mongoose.Schema;


var dummySchema = new Schema({
    name: {
        type: String,
        required: true
    },
    brand: {
        type: String
    },
    class: {
        type: String,
        required: true
    },
    price: {
        type: Number,
        required: true
    },
    available: {
        type: Boolean,
        required: true
    },

    dateavailable: {
        type: Date,
        default:Date.now    }
});



module.exports = mongoose.model('Dummy', dummySchema);



//user.js
var mongoose     = require('mongoose');
var Schema       = mongoose.Schema;

var userSchema = new Schema({
    username: {
        type: String,
        required: true
    },
    password: {
        type: String,
        required: true
    }
});





module.exports = mongoose.model('User', userSchema);

但我不知道如何从 angular.js 调用它们

我的 intro.html 如下

<!-- public/index.html -->
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <base href="/">

    <title>Starter Node and Angular</title>

    <!-- CSS -->
    <link rel="stylesheet" href="libs/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css"> <!-- custom styles -->

    <!-- JS -->
    <script src="libs/angular/angular.min.js"></script>
    <script src="libs/angular-route/angular-route.min.js"></script>

    <!-- ANGULAR CUSTOM -->
    <script src="js/controllers/MainCtrl.js"></script>
    <script src="js/controllers/NerdCtrl.js"></script>
    <script src="js/services/NerdService.js"></script>
    <script src="js/appRoutes.js"></script>
    <script src="js/app.js"></script>
</head>
<body ng-app="sampleApp" ng-controller="NerdController">
<div class="container">

    <!-- HEADER -->
    <nav class="navbar navbar-inverse">
        <div class="navbar-header">
            <a class="navbar-brand" href="/">Stencil: Node and Angular</a>
        </div>

        <!-- LINK TO OUR PAGES. ANGULAR HANDLES THE ROUTING HERE -->
        <ul class="nav navbar-nav">
            <li><a href="/nerds">Nerds</a></li>
        </ul>
    </nav>

    <!-- ANGULAR DYNAMIC CONTENT -->
    <div ng-view></div>

</div>
</body>
</html>

我想在用户点击每个链接时给他们打电话。如果有人可以帮助我开发 angularjs 服务。

Answer 1

最好是创建一个服务，但你也可以在 ctrl 中完成

// users.service.js
var userService = angular.module('app.userService', ['ngResource'])
.factory('users', function ($http, $q) {
    var that = this;
    this.data = {};
    var url = '';

    var factory = {
        get: get
    };

    function get() {
        url = '/api/users';
        var defer = $q.defer();

        $http.get(url).
            success(function (data, status, headers, config) {
                defer.resolve(data);
            }).
            error(function (data, status, headers, config) {
                defer.reject(data);
            });
        return defer.promise;
    };
});

// some.controller.js
angular.module('app.somectrl', ['app.userService'])
    .controller(someController);

function someController(userService) {
    userService.get().then(function (res) {
        // do sth
    }, function (err) {
       // handle error
    });
}