角度未知的提供者,不能POST /注册

时间:2015-02-09 05:44:11

标签: javascript angularjs mean-stack

在你说什么之前,我知道解决方案可能是注入依赖,但我检查了其他开源代码并将其与我的进行比较,它完全相同。虽然他们在我的工作不起作用时工作

目前问题出在路线'/ signup'

错误:错误:unpr 当我在路线'/ signup'和

检查控制台时,未知提供商

每当我进入'/ signup'路线并按下提交按钮时,它应该点击api并重定向到'/',但我得到的是无法发布/注册。

当我使用POSTMAN时api工作得很好,我认为问题是有角度的。

index.html(脚本的顺序是否重要?)

<!DOCTYPE html> 
<html ng-app="MyApp">
<head>
    <title></title>
    <base href='/'> 
    <!-- load bootstrap from CDN and custom CSS -->
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <!-- <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/animate.css/3.1.1/animate.min.css"> -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">

    <!-- JS -->
    <!-- load angular and angular-route via CDN -->
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular-route.js"></script>

    <script src="app/app.js"></script>
    <script type="text/javascript" src="app/controllers/userController.js"></script>
    <script type="text/javascript" src="app/services/factories.js"></script>


</head>
<body>


    <div ng-view></div>

</body>
</html>

app.js

angular.module('MyApp', ['ngRoute'])

    .config(function($routeProvider, $locationProvider) {

        $routeProvider

            .when('/', {
                templateUrl: 'app/views/home.html',
                controller: 'HomeController'

            })

            .when('/signup', {
                templateUrl: 'app/views/signup.html',
                controller: 'SignUpController'
            });

        $locationProvider.html5Mode(true);  
    }) 

userController.js

 angular.module('MyApp')

    .controller('SignUpController', function($scope, User) {


        // sign up the user
        $scope.signup = function() {

            User.create({
                name: $scope.name,
                username: $scope.username,
                password: $scope.password
            });

        }


    });

factories.js

angular.module('MyApp')

.factory('User', function($http, $alert, $window, $location) {


    var userFactory = {};

    userFactory.create = function(userData) {
        return $http.post('/api/signup', userData)
            .then(function(data) {
                $window.localStorage.setItem('token', response.data.token);
                $location.path('/');
            });
    }


    return userFactory;

});

signup.html

<div class="span3 well">
      <legend>New to Project626? Sign up!</legend>
    <form method="post" ng-submit="signup()">
        <input class="span3" name="name" placeholder="Full Name" type="text" ng-model="name"> 
        <input class="span3" name="username" placeholder="Username" type="text" ng-model="username">
        <input class="span3" name="password" placeholder="Password" type="password" ng-model="password"> 
        <button class="btn btn-primary" type="submit">Sign up for Project626</button>
    </form>
</div>

我喜欢这种角度写法,因为它对我来说更干净。对于您的信息,我在上面提到的开源是https://github.com/sahat/tvshow-tracker/blob/master/public/controllers/signup.js

1 个答案:

答案 0 :(得分:1)

你没有添加

<script src="angular-route.js">

订单必须是这样:

  <script src="app/app.js"></script>
  <script type="text/javascript" src="app/services/factories.js"></script>
  <script type="text/javascript" src="app/controllers/userController.js"></script>

这就是它为路线显示未知提供商的原因。