AngularJS,NodeJs和ExpressJS

时间:2015-05-06 17:31:58

标签: javascript html angularjs node.js

该程序只是为了学习如何工作angular,express和nodejs。

我的图书馆是:

angular.js 角route.js

我正在尝试运行此代码,但我正在纠错:

Uncaught TypeError: url.match is not a function (13:04:31:527 | error,  javascript)
  at completeRequest (public_html/js/libs/angular.js/angular.js:10437:27)
  at xhr.onreadystatechange              (public_html/js/libs/angular.js/angular.js:10404:11)

我的HTML是:

<head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <script src="js/libs/angular.js/angular-resource.js" type="text/javascript"></script>
    <script src="js/libs/angular.js/angular-route.js" type="text/javascript"></script>
    <script src="script.js" type="text/javascript"></script>

</head>
<body ng-controller="AppCtrl" >

    <form >
        <input type="text" ng-model="url" size="80" aria-label="URL" />
        <br>
        <br>            Parameter 1: 
        <input type="text" ng-model="param1">
        <br>
        <br>
        Parameter 2: 
        <input type="text" ng-model="param2">
    </form>
    <br>
    <br>
     <button id="samplegetbtn" ng-click="click('http://localhost:8000/calc/param1/:param1/param2/:param2')">Sample GET</button>
     <br>
     <div >Sum: {{data}}</div>
    <br>
</body>

我的服务器端是:

var url = require('url');
//Require express, 
var express = require('express');
//and create an app
var app = express();

//app.get() which represents the HTTP GET method
app.get('/', function (req, res) {

  res.send('Hello World!');

});

//app.get() which represents the HTTP GET method
app.get('http://localhost:8000/calc/param1/:param1/param2/:param2', function (req, res) {

var a = parseInt(req.params.param1);
  console.log(a);
  var b = parseInt(req.params.param2);
  console.log(b);


var output = a + b;
  console.log(output);
  res.sendStatus(output);

});



var server = app.listen(8000, function () {

  var host = server.address().address;
  var port = server.address().port;

  console.log('Example app listening at http://' + host + ':' + port);

});

我的AngularJS脚本:

(function(angular) {
'use strict';
 angular.module('myCalc', ['ngRoute'])



 .controller('AppCtrl', function($scope, $http, $templateCache) {
    $scope.click = function(url) {
    $scope.url = url;
    var param1 = $scope.param1;
  var param2 = $scope.param2;

$http.get({ url: $scope.url, param1: $scope.param1, param2: $scope.param2, cache: $templateCache}).
 //    $http.get({ url: $scope.url,  cache: $templateCache}).
        success(function(data) {
        $scope.data = data;
       }).
        error(function(data) {
        $scope.data = data || "Request failed";
      });

  };

})


 .config(function($routeProvider, $locationProvider) {
   $routeProvider
   .when('http://localhost:8000/calc/param1/:param1/param2/:param2', {
    templateUrl: 'index.html',
    controller: 'AppCtrl'


   // configure html5 to get links working on jsfiddle
   $locationProvider.html5Mode(true);
 });
})(window.angular);

1 个答案:

答案 0 :(得分:0)

您正在通过url和{ $http.get

以错误的方式params
  

$http.get(url, {configjson})

     

AS的第一个参数是url&amp;第二个用于配置

<强>代码

$http.get($scope.url, {
    params: {
        param1: $scope.param1,
        param2: $scope.param2
    },
    cache: $templateCache
}).
success(function(data) {
    $scope.data = data;
}).
error(function(data) {
    $scope.data = data || "Request failed";
});