AngularJS 오류:오류 유형: v2.login이 함수가 아닙니다.

AngularJS 오류:오류 유형: v2.login이 함수가 아닙니다.

로그인 버튼을 클릭하면 로그인 기능을 호출하고 싶은데 제목에 오류 메시지가 계속 뜨네요.누가 내 대본의 오류를 지적해 줄 수 있습니까?

login.js 코드 아래:

/*global Firebase, angular, console*/

'use strict';
// Create a new app with the AngularFire module
var app = angular.module("runsheetApp");

app.controller("AuthCtrl", function ($scope, $firebaseAuth) {
    var ref = new Firebase("https://xxxxx.firebaseio.com");
    function login() {
        ref.authWithPassword({
            email    : "xxxxx",
            password : "xxxx"
        }, function (error, authData) {
            if (error) {
                console.log("Login Failed!", error);
            } else {
                console.log("Authenticated successfully with payload:", authData);
            }
        });
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>

그리고 login.html의 코드도 아래와 같습니다.

<div class="container" style="max-width: 300px">
    <form class="form-signin">       
      <h2 class="form-signin-heading" style="text-align: center">Please Sign In</h2>
      <input type="text" class="form-control" name="username" ng-model = "username" placeholder="Email Address" required="" autofocus="" />
        </br>
      <input type="password" class="form-control" name="password" ng-model = "password" placeholder="Password" required=""/>
        </br>
      <button class="btn btn-lg btn-primary btn-block" type="submit" ng-click="login()">Login</button>   
    </form>
  </div>

엣지 케이스는 여기 있습니다만, 포스터 때문에 말씀드리고 싶습니다.으로 컨트롤러 As를을 사용할 때 가 발생했습니다.name와 같은 ng-submit를 들어 예를 들어,

<form name="authCtrl.signUp" ng-submit="authCtrl.signUp()">

Throws: TypeError: v2.signUp이 함수가 아닙니다.

해결책은 양식의 이름을 다른 것으로 바꾸는 것이었습니다.

<form name="authCtrl.signUpForm" ng-submit="authCtrl.signUp()">

저 같은 경우에는 당신과 똑같은 문제가 있었습니다.하지만 그런 시나리오에 대한 gkalpak의 대답을 우연히 접한 것이 도움이 되었습니다.

알고 보니 제가 부르던 것이 addBuddy() 함수였는데, 이 함수는 "addBuddy"라는 이름의 형태였습니다.해결책은 두 가지 중 하나의 이름을 바꾸어 하나를 돋보이게 하거나 다른 것과 차별화할 수 있도록 하는 것이었습니다.폼의 이름을 "add BuddyForm"과 voila로 변경했습니다!내 기능이 통했어요!

다음은 제 사례의 일부분입니다.

<form name="addBuddy" class="form-horizontal" novalidate>
...
<button class="btn btn-sm btn-info" ng-click="addBuddy()>Submit</button>

전 다음으로 바꿨습니다.

<form name="addBuddyForm" class="form-horizontal" novalidate>
...
<button class="btn btn-sm btn-info" ng-click="addBuddy()>Submit</button>

...잘 됐어요! :)

각도에 있음JS는 $scope 내에 있어야 하는 뷰 함수를 호출합니다.

JS

// exposes login function in scope
$scope.login = login;

HTML

<div class="container" ng-controller="AuthCtrl" style="max-width: 300px"> <!-- I notice here for include ng-controller to your main div -->
<form class="form-signin">       
  <h2 class="form-signin-heading" style="text-align: center">Please Sign In</h2>
  <input type="text" class="form-control" name="username" ng-model = "username" placeholder="Email Address" required="" autofocus="" />
    </br>
  <input type="password" class="form-control" name="password" ng-model = "password" placeholder="Password" required=""/>
    </br>
  <button class="btn btn-lg btn-primary btn-block" type="submit" ng-click="login()">Login</button>   
</form>

이것은 당신의 문제와 관련된 것이 아닐 수도 있지만, 저도 이 오류가 발생하고 있었고 그 이유를 파악하는 데 시간이 조금 걸렸습니다.

함수와 변수의 이름을 모두 같게 지었는데, 함수에 변수가 할당되어 있었기 때문에 변수의 할당이 함수를 우선시하고 있었고 두 번째 실행에서 폭발적으로 증가했습니다.

예제에서 upploadFile() 기능이 uppload.upploadFile = true로 표시됩니다.이 파일은 uploading.upploadingFile - 스피너의 동작을 제어하기 위해 사용되는 플래그입니다.일단 그것이 고쳐지자, 그 문제는 사라졌습니다.

예:

(function()
{
  'use strict';

  angular.module('aumApp.file-upload')
  .controller('FileUploadCtrl', FileUploadCtrl);

  function FileUploadCtrl($scope, $http)
  {
    upload.uploadFile = function()
    {
      upload.uploadFile = true;
      var backendUrl = '/ua_aumcore/events/api/v1/events/uploadFile';
      var fd = new FormData();
      fd.append('file', upload.src);
      $http({ url: backendUrl, data: fd, method: 'POST', transformRequest : angular.identity, headers: { 'Content-Type' : undefined } })
      .then(function uploadSuccess(response)
      {
        upload.data = response.data;
        upload.message = "Uploaded Succesfully.";
        upload.uploadSuccess = true;
        upload.uploadingFile = false;
      },
      function uploadFailure(response)
      {
        upload.message = "Upload Failed.";
        upload.uploadSuccess = false;
        upload.uploadingFile = false;
      });
    };
  }
  FileUploadCtrl.$inject = ['$scope', '$http'];
})();

뷰에서 호출하려면 함수가 $scope에 있어야 합니다. 추가

$scope.login = login;

컨트롤러의 JS 코드로 이동합니다.

실제로 그 컨트롤러를 사용해야 합니다.바꾸다

<div class="container" style="max-width: 300px">

로.

<div ng-controller="AuthCtrl" class="container" style="max-width: 300px">

이것은 모두 기본적인 것입니다.제 조언은 Angular에서 배우라는 것입니다.더 나아가기 전에 JS 튜토리얼.

두 가지 방법을 사용하면 $scope에 로그인 기능을 할당할 수 있습니다.기능 코드를 다음과 같이 바꿉니다.

$scope.login=function() {
        ref.authWithPassword({
            email    : "nick.koulias@gmail.com",
            password : "Jaeger01"
        }, function (error, authData) {
            if (error) {
                console.log("Login Failed!", error);
            } else {
                console.log("Authenticated successfully with payload:", authData);
            }
        });
    }

제가 답변이 늦었을 수도 있습니다.하지만 저한테는 통합니다.

설정한 양식 이름을 확인합니다(예: ng-form=" login").

기능 이름(예: ng-click="login()")

그러면 작동하지 않습니다. ng-form="loginForm"과 같이 둘 중 하나를 변경해야 합니다.

설명:

AngularJS 1.x는 임의의 것을 등록합니다.form가 있는 DOM 요소name에 있는 재산.$scope경유로formDirectiveFactory. 이 지침은 자동으로 인스턴스화됩니다.form.FormController위의 내용이 사실일 경우:

만약에name속성이 지정되고 폼 컨트롤러가 아래의 현재 범위에 게시됩니다.

보낸이: 각도.js:24855

그러므로 만약 당신이.<form name=myForm>그것은 당신의 것을 무시할 것입니다.$scope.myForm = function() { ... }

저도 같은 오류 메시지가 있었습니다.저의 경우 실수로 컨트롤러에 함수와 같은 이름의 변수를 추가했습니다.그렇게 되면 이 오류도 발생합니다.

언급URL : https://stackoverflow.com/questions/32003458/angularjs-error-typeerror-v2-login-is-not-a-function