2015-11-03 73 views
3

我試圖將我的web應用程序連接到我的後端服務器貓鼬。該服務器託管在本地atm。連接到api nodeJS和mongoDB

我想從我的服務器獲取「食譜」對象並獲得它的標題。 我收到以下錯誤:

angular-ui-router.js:18 Uncaught TypeError: Cannot read property 'isDefined' of undefined(anonymous function) @ angular-ui-router.js:18(anonymous function) @ angular-ui-router.js:3223 angularApp.js:3 Uncaught ReferenceError: angular is not defined

我得到使用郵遞員我的對象。

[ 
{ 
    "_id": "56309ea8e4b02bf207dbe409", 
    "title": "Chili sin carne", 
} 
] 

我們的HTML頁面

<html> 
<head> 
<title>Recipes</title> 
<link rel='stylesheet' href='/stylesheets/inlog.css' /> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-    router/0.2.10/angular-ui-router.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">   </script> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"></script> 
<script src="javascripts/angularApp.js"></script> 
</head> 
<body> 
<table > 
    <div ng-controller="RecipesCtrl"> 
<h1>Title </h1> 
//here we load a recipe object and get it's title and show it 
    <p>{{$scope.title}}</p> 
</div> 
</body> 
</html> 

的Javascript

'use strict'; 

var app = angular.module('project-eva', []); 

app.config([ 
'$stateProvider', 
'$urlRouterProvider', 
function($stateProvider,$urlRouterProvider){ 
$stateProvider 
.state('home', { 
    url: '/home', 
    templateUrl: '/home.html', 
    controller: 'MainCtrl', 

}) 
.state('login', { 
    url: '/login', 
    templateUrl: '/login.html', 
    controller: 'loginCtrl', 
    onEnter: ['$state', 'auth', function($state, auth){ 
    if(auth.isLoggedIn()){ 
     $state.go('home'); 
    } 
    }] 
}) 
.state('register', { 
    url: '/register', 
    templateUrl: '/register.html', 
    controller: 'AuthCtrl', 
    onEnter: ['$state', 'auth', function($state, auth){ 
    if(auth.isLoggedIn()){ 
     $state.go('home'); 
    } 
    }] 
}) 
.state('recipes', { 
    url: '/recipes', 
    templateUrl: '/recipes.html', 
    controller: 'RecipeCtrl', 
    onEnter: ['$state', 'auth', function($state, auth){ 
    if(auth.isLoggedIn()){ 
     $state.go('home'); 
    } 
    }] 
    }); 
    $urlRouterProvider.otherwise('home'); 
    }]); 




app.factory('recipes', ['$http' ,function($http){ 
var o = { 
    recipes: [] 
}; 
o.getAll = function(){ 
    return $http.get('/recipes').success(function(data){ 
     angular.copy(data,o.recipes); 

    }); 
}; 
return o; 
}]); 

規則控制器

var app = angular.module('project-eva') 

app.controller('RecipesCtrl', function ($scope, $location, $rootScope,  $http) { 
"use strict"; 


$scope.recipes = function(){ 

    $http({ 
     method: 'GET', 
     url: 'localhost:8080/api/recipes', 
     headers: { 
     'Access-Control-Allow-Origin' : '*', 
     'Content-Type': 'application/json' 
     }, 
     data: { 
     title : $scope.title; 
     } 
    }).then(function succesCallBack(response){ 
     console.log(response); 

    }, function errorCallback(response){ 
     console.log(response); 
     if(response.data !== null){ 
      $scope.error = response.data.message; 
     } else { 
      $location.path('/ise'); 
     } 
    }); 
    } else { 
    $scope.error = "Please fill in all required fields."; 
    } 
} else { 
    $scope.error = "Password and confirm password have to be te same!"; 
} 
} 
}); 

回答

2

您在html兩次進口角UI的路由器,但從來沒有角本身。從angular.io下載它。你也可以使用bower或npm。你必須有一個

<script src="somewhere/angular.js"></script>