0

我開發了一個小型任務,用於使用Firebase身份驗證的Gmail用戶登錄和註銷。我所面臨的問題在我的代碼Uncaught Error: [$injector:modulerr]

我已經添加了以下庫:

<script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<script src="https://apis.google.com/js/platform.js" async defer></script>

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

<script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>

<script src="https://www.gstatic.com/firebasejs/3.9.0/firebase.js"></script>

並初始化的火力配置。

index.html

<html ng-app="appName"> 
<body ng-controller="loginCtrl"> 
    <div id="message"> 
     <button ng-click="googleSignin()">SignIn into App</button> 
    </div> 
    <p id="load">Firebase SDK Loading&hellip;</p> 
</body> 

loginpage

當我們點擊按鈕的標誌,它會顯示完成身份驗證後,Gmail的認證彈出它重定向到htmlnew.html頁面

app.js

var app = angular.module("appName", ["ngRoute"]); 
app.config(function ($routeProvider) { 
$routeProvider 
     .when("/", { 
      templateUrl: 'assests/index.html', 
      controller: 'loginCtrl' 
     }) 
}); 
app.controller('loginCtrl', function ($scope) { 
var provider = new firebase.auth.GoogleAuthProvider(); 
$scope.googleSignin = function() { 
    firebase.auth() 

      .signInWithPopup(provider).then(function (result) { 
     var token = result.credential.accessToken; 
     var user = result.user; 
     console.log(token); 
     console.log(user); 

     firebase.auth().onAuthStateChanged(function user() { 
      if (user) { 
       window.location = 'htmlnew.html'; 
      } 
     }); 
    }).catch(function (error) { 
     var errorCode = error.code; 
     var errorMessage = error.message; 
     console.log(errorCode); 
     console.log(errorMessage); 
    }); 
    } 
}); 

app.controller('SecondController', [function ($scope) { 
    $scope.googleSignout = function() { 
     firebase.auth().signOut() 
       .then(function() { 
        console.log('Signout Succesfull'); 
       }, function (error) { 
        console.log('Signout Failed'); 
       }); 
    } 
}]); 

htmlnew.html

<html data-ng-app="appName"> 
<body ng-controller="SecondController"> 
    <div id="message"> 
     <h1>Welcome</h1> 
     <button ng-click="googleSignout()">Google Signout</button> 
    </div> 

</body> 

signout

這是問題所在

1),則拋出未被捕獲的錯誤:[$注射器:modulerr]錯誤而進入htmlnew.html page

error

2)Signout不工作

+0

爲什麼你調用兩次'數據-NG-應用= 「APPNAME」'?您是否使用SPA? –

+0

我是angularjs的初學者。 SPA ??沒有必要兩次調用'ng-app'。 –

+0

@PrasathV你不需要在每個頁面中調用ng-app。在主頁面調用它(例如index.html),然後使用'ng-view'在索引體上包含模塊。這就是Angular的工作原理。 – Mistalis

回答

1

你錯過注入火力地堡作爲應用程序的一個dependency。在你的模塊定義,增加火力點:

var app = angular.module("appName", ["ngRoute", "firebase"]); 

Here is a JSFiddle demo using Firebase

+0

刪除了'ng-app'並在模塊定義中添加了firebase。現在錯誤被修復了。只有退出不起作用。 –

+0

@PrasathV很高興你的第一個問題解決了。你能解釋一下嗎?註銷不能工作*,或者針對這個特定問題發佈不同的問題?目前,我無法弄清楚可能會導致此行爲的原因。 – Mistalis

+0

單擊註銷時,它必須清除會話並重定向到索引頁面。好的,將作爲一個新問題發佈。感謝您的迴應 –

相關問題