angularjs在按钮单击时给出错误

Question

我创建了一个表单，当我尝试点击按钮时，它给出的错误如下：

Error: [$injector:unpr] http://errors.angularjs.org/1.2.12/$injector/unpr?p0=%24routeParamsProvider%20%3C-%20%24routeParams
    at Error (native)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:6:450
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:32:125
    at Object.c [as get] (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:30:200)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:32:193
    at c (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:30:200)
    at d (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:30:417)
    at Object.instantiate (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:31:80)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js:62:33
    at http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js:2797:28 <div ui-view="" class="ng-scope">
  (anonymous function)  angular.min.js:85
  (anonymous function)  angular.min.js:62
  H angular.min.js:49
  f angular.min.js:42
  (anonymous function)  angular.min.js:42
  updateView    angular-ui-router.js:2733
  (anonymous function)  angular-ui-router.js:2697
  h.$broadcast  angular.min.js:105
  $state.transition.resolved.then.$state.transition angular-ui-router.js:2114
  A angular.min.js:93
  (anonymous function)  angular.min.js:94
  h.$eval   angular.min.js:102
  h.$digest angular.min.js:100
  h.$apply  angular.min.js:103
  f angular.min.js:67
  H angular.min.js:71
  C.onreadystatechange  angular.min.js:72

我已经在 .html 文件中编写了代码 我有 register.html 页面为：

<form name="myForm"  ng-controller="registerNew()" novalidate>

    <p>Preferred UserName:<br>
        <input type="text" name="NewUname" ng-model="NewUname" required>
  <span style="color:red" ng-show="myForm.NewUname.$dirty && myForm.NewUname.$invalid">
  <span ng-show="myForm.NewUname.$error.required">User Name is required.</span>
  </span>
    </p>

    <p>FirstName:<br>
        <input type="text" name="fName" ng-model="fName" required>
  <span style="color:red" ng-show="myForm.fName.$dirty && myForm.fName.$invalid">
  <span ng-show="myForm.fName.$error.required">First Name is required.</span>
  </span>
    </p>

    <p>LastName:<br>
        <input type="text" name="lName" ng-model="lName" required>
  <span style="color:red" ng-show="myForm.lName.$dirty && myForm.lName.$invalid">
  <span ng-show="myForm.lName.$error.required">Last Name is required.</span>
  </span>
    </p>

    <p>Email:<br>
        <input type="email" name="mail" ng-model="mail" required>
  <span style="color:red" ng-show="myForm.mail.$dirty && myForm.mail.$invalid">
  <span ng-show="myForm.mail.$error.required">Email is required.</span>
  <span ng-show="myForm.mail.$error.email">Invalid email address.</span>
  </span>
    </p>

    <p>Password:<br>
        <input type="password" name="newpwd" ng-model="newpwd" required>
  <span style="color:red" ng-show="myForm.newpwd.$dirty && myForm.newpwd.$invalid">
  <span ng-show="myForm.newpwd.$error.required">Password is required.</span>
  </span>
    </p>

    <p>Confirm Password:<br>
        <input type="password" name="newcPWD" ng-model="newcPWD" required >
  <span style="color:red" ng-show="myForm.newcPWD.$dirty && myForm.newcPWD.$invalid">
  <span ng-show="myForm.newcPWD.$error.required">Password is required.</span>
  </span>
    </p>

    <p>
        <input type="submit" ng-click="addNew()"
               ng-disabled="myForm.lname.$dirty && myForm.lname.$invalid ||
               myForm.fname.$dirty && myForm.fname.$invalid ||
  myForm.mail.$dirty && myForm.mail.$invalid ||
  myForm.pwd.$dirty && myForm.pwd.$invalid ||
  myForm.cpwd.$dirty && myForm.cpwd.$invalid">
    </p>


</form>

在 Public/javascript/controller.js 中，我的代码如下：

function registration($scope, $routeParams, test)
{
    console.log('inside db function');
    $scope.registerNew = function()
    {
        console.log('inside db function');
    }
}

和 app.js 类似：

angular.module('test', [])
        .config(function($routeProvider) {

            $routeProvider
                .when('register', {
                    url: '/register',
                    templateUrl: '../partials/register.html',
                    controller: 'registration'
                });
            $routeProvider.when('login', {
                url: '/login',
                templateUrl: '../partials/login.html',
                controller: 'login'
            });


        });

我已将主 html 文件中的 ng-app 定义到主 div 上：

Answer 1

<form name="myForm"  ng-controller="registerNew()" novalidate>

应该是

<form name="myForm"  ng-controller="registration" novalidate>

和

function registration($scope) {..

Answer 2

确保注入到控制器的所有依赖项都是正确的，并且没有拼写错误或未定义。

click here to get error description from AngularJS Docs

Answer 3

在 app.js 中，尝试更改它

angular.module('test', [])

到这里

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

您需要注入 ngRoute 服务才能使用 $routeProvider。

有关更多信息，请参阅此内容： AngularJs Docs

我希望这会有所帮助。

Answer 4

您的代码不清楚，但您应该试试这个，您可以在重定向到类似 URL 时使用井号

 href='#/login '   

希望这会有所帮助。