Question

我已经设置了我的应用程序，允许通过Facebook，Twitter，Google和＆amp;电子邮件。然而后者我无法开始工作，因为它带回了以下错误信息。

angular.js:13550 TypeError: Cannot read property 'email' of undefined
at Scope.$scope.loginEmail (main.js:34)
at fn (eval at <anonymous> (angular.js:14432), <anonymous>:4:221)
at expensiveCheckFn (angular.js:15485)
at callback (angular.js:25018)
at Scope.$eval (angular.js:17229)
at Scope.$apply (angular.js:17329)
at HTMLButtonElement.<anonymous> (angular.js:25023)
at HTMLButtonElement.jQuery.event.dispatch (jquery.js:4737)
at HTMLButtonElement.elemData.handle (jquery.js:4549)

在我的app.js中，我创建了一个名为auth的工厂，你可以看到

theBigWeddingBook.factory('Auth', function ($firebaseAuth) {
var ref = new Firebase("https://the-big-wedding-book.firebaseio.com/");
return $firebaseAuth(ref);
});

然后在我的main.js中我创建了AuthCtrl来控制所有登录。你可以在下面看到这一点。

heBigWeddingBook.controller('AuthCtrl', function($scope, Auth){
Auth.$onAuth(function(authData) {
    $scope.authData = authData;
    console.log(authData);
})

$scope.loginFacebook = function() {
    Auth.$authWithOAuthPopup("facebook").catch(function(error){
        console.error(error);
    })
}

$scope.loginTwitter = function() {
    Auth.$authWithOAuthPopup("twitter").catch(function(error){
        console.error(error);
    })
}

$scope.loginGoogle = function() {
    Auth.$authWithOAuthPopup("google").catch(function(error){
        console.error(error);
    })
}

$scope.loginEmail = function() {
    Auth.$authWithPassword({
        email: $scope.user.email,
        password: $scope.user.password
    }).catch(function(error){
        console.error(error);
    })
}

$scope.logout = function() {
    Auth.$unauth();
}
});

我看不出我做错了什么。我正在尝试登录我在Firebase中设置的电子邮件和密码。有人可能会指出我正确的方向吗？

由于

Answer 1

我最终成功地完成了这项工作。我删除了我输入的关于app.js文件的所有代码，然后在main.js中添加了以下代码

'use strict';

var theBigWeddingBook = angular.module('theBigWeddingBook');

theBigWeddingBook.controller('MainCtrl', function ($scope, $firebaseAuth) {
var ref = new Firebase("https://the-big-wedding-book.firebaseio.com");
var auth = $firebaseAuth(ref);

ref.onAuth(function(user) {
  if (user) {
    console.log("Authenticated with uid:", user.uid);
  } else {
    console.log("Client unauthenticated.")
  }
});

$scope.user = {};

$scope.logIn = function() {
    var username = $scope.user.email;
    var password = $scope.user.password;

    auth.$authWithPassword({
        email: username,
        password: password
    }).then(function(user) {
        console.log(user);
    }).catch(function(error) {
        console.log(error);
    })
}

$scope.loginFacebook = function() {
    auth.$authWithOAuthPopup('facebook').then(function(user) {
        console.log(user);
    }).catch(function(error) {
        console.log(error);
    })
}

$scope.loginTwitter = function() {
    auth.$authWithOAuthPopup('twitter').then(function(user) {
        console.log(user);
    }).catch(function(error) {
        console.log(error);
    })
}

$scope.loginGoogle = function() {
    auth.$authWithOAuthPopup('google').then(function(user) {
        console.log(user);
    }).catch(function(error) {
        console.log(error);
    })
}

$scope.logOut = function() {
    auth.$unauth();
}

});

然后正如Harry lim所说，输入表格如下：

<div class="container" ng-controller="MainCtrl">
<div class="row">
    <div class="col-md-12">
        <form class="form-signin" role="form">
            <div class="form-group">
                <input type="email" name="email" ng-model="user.email" class="form-control" placeholder="Email address" required="" autofocus="">
            </div>
            <div class="form-group">
                <input type="password" name="password" ng-model="user.password" class="form-control" placeholder="Password" required="">
            </div>
            <div class="form-group">
                <label class="checkbox"><a href="#/registration">Sign Up</a></label>
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block" type="button" ng-click="logIn()">Login</button>
            </div>
            <div class="row">
                <div class="col-md-4">
                    <div class="form-group">
                        <button class="btn btn-lg btn-primary btn-block" type="button" ng-click="loginFacebook()">Login with Facebook</button>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="form-group">
                        <button class="btn btn-lg btn-primary btn-block" type="button" ng-click="loginTwitter()">Login with Twitter</button>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="form-group">
                        <button class="btn btn-lg btn-primary btn-block" type="button" ng-click="loginGoogle()">Login with Google</button>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-primary btn-block" type="button" ng-click="logOut()">Logout</button>
            </div>
        </form>
    </div>
</div>
</div>

我希望这可以帮助将来的某个人。

如何使用Angular和Firebase修复我的电子邮件登录？

1 个答案: