angularjs – 如何正确实现angularFireAuth？

这是我的应用程序的路由器：

angular.module('phonecat',['firebase']).
 config(['$routeProvider',function($routeProvider) {
 $routeProvider.
      when('/phones',{
        templateUrl: 'partials/phone-list.html',controller: PhoneListCtrl,authRequired: false,pathTo: '/phones'
      }).
      when('/phones/:age',{
        templateUrl: 'partials/phone-detail.html',controller: PhoneDetailCtrl,authRequired: true,pathTo: '/phones/:phoneId'
      }).
      when('/login',{
        templateUrl: 'partials/login.html',controller: LoginCtrl,pathTo: '/login'
      }).
      otherwise({
        redirectTo: '/phones'
      }); }]);

这就是控制器的样子 – 但它可能不正确.登录函数被调用,但我不知道下一步该怎么做.我应该如何将用户从登录页面重定向到phone-detail.html页面？

'use strict';

function PhoneListCtrl($scope,angularFire,angularFireAuth) {
  var url = 'https://<link>.firebaseio.com/';
  var promise = angularFire(url,$scope,'phones',[]);
  angularFireAuth.initialize(url,{scope: $scope,name: "user"});
}

function PhoneDetailCtrl($scope,$routeParams,angularFireAuth) {
  var url = 'https://<link>.firebaseio.com/' + $routeParams.age;
  angularFireAuth.initialize(url,path: "/login"});
  $scope.$on("angularFireAuth:login",function(evt,user) {
    var promise = angularFire(url,'phone',{}); 
  });
  $scope.$on("angularFireAuth:logout",function(evt) {
    console.log("you are logged out.");
  });
  $scope.$on("angularFireAuth:error",err) {
    console.log(err);
  });
}

function LoginCtrl($scope,angularFireAuth) {
  var url = 'https://<link>.firebaseio.com';
  $scope.form = {};
  $scope.login = function() {
    console.log("called");
    var username = $scope.form.username;
    var password = $scope.form.password;
    angularFireAuth.login('password',{
        email: username,password: password,rememberMe: false
      });
  };
}

login.html看起来像这样：

<input type="text" name="username" ng-model="form.username"><br>
<input type="text" name="password" ng-model="form.password"><br>
<button name="login" id="login" ng-click="login()">login</button>

我想要达到的目的是：

>列出所有手机
>如果用户单击以获取其中一个的详细信息,请检查它们是否已通过身份验证
>如果是,请显示电话详细信息 – 如果没有,请将其重定向到登录页面.
>登录后,将其重定向到手机详细信息视图.

我在第3点和第4点挣扎.

更新

在Anant的评论之后 – 我发现了一些非常有趣的东西.我在angularFire.js中添加了一些调试消息,暂时我在上面的控制器中将authRequired从true更改为false.

如果导航到/ phones – 我会按预期从firebase返回一个列表.在_loggedIn()里面我添加了console.log(user),它返回一个用户对象(同样,在初始化内部我添加了一个调试语句：https://github.com/firebase/angularFire/blob/master/angularFire.js#L437 – 两者都确认我有一个有效的用户,已经登录了.

如果我然后单击一个项目,我得到我期望的 – 用户名和实际页面加载(请参阅下面的html).如果我刷新该页面(http：/// phones /#/ 0)我再次获得正确的页面,在控制台中,我仍然看到一个有效的用户对象,表明用户仍然登录

这是phone-list.html和phone-details.html的HTML：

phone-list.html
<div class="container-fluid">
    <div class="row-fluid">
      <div class="span4">
        <!--Body content-->

        <ul class="phones">
          <li ng-repeat="phone in phones">
            <a href="#/phones/{{phone.age}}">{{phone.id}}</a>
            <p>{{phone.snippet}}</p>
          </li>
        </ul>
      </div>
    </div>
  </div>

phone-detail.html
<span ng-show="user">
  {{user.email}} | <a ng-click="logout()">Logout</a>
  you are look looking at {{ phone.name }}
</span>
<span ng-hide="user">
  login pls!
</span>

来自JSON的片段(现在是Firebase的一部分)：

[
{
    "age": 0,"id": "motorola-xoom-with-wi-fi","imageUrl": "img/phones/motorola-xoom-with-wi-fi.0.jpg","name": "Motorola XOOMu2122 with Wi-Fi","snippet": "The Next,Next GenerationrnrnExperience the future with Motorola XOOM with Wi-Fi,the world's first tablet powered by Android 3.0 (Honeycomb)."
},{
    "age": 1,"id": "motorola-xoom","imageUrl": "img/phones/motorola-xoom.0.jpg","name": "MOTOROLA XOOMu2122",Next GenerationnnExperience the future with MOTOROLA XOOM,the world's first tablet powered by Android 3.0 (Honeycomb)."
}...etc

如果我然后将authRequired更改回true – 如果用户对象可用,那么我得到一个无限循环的页面加载 – 首先它是/ login然后它会自动重定向/ phone / 0并立即返回/ login再次登录,并且这种情况发生在浏览器崩溃之前.

更新2

在添加了一些进一步的调试行并使用代码后,我提出了这个解决方案：

将初始化添加到LoginCtrl：

var url = 'https://<link>.firebaseio.com/'; 
angularFireAuth.initialize(url,{scope: $scope});

在angularFire.js中,我注释掉406和407行：

//this._redirectTo = null;
//this._authenticated = false;

将代码附加到第438行,基本上我将这个._authenticated = true和this._redirectTo = $route.current.pathTo – 以及this._authenticated = false添加到else语句中.

var client = new FirebaseSimpleLogin(this._ref,function(err,user) {
  self._cb(err,user);
    if (err) {
      $rootScope.$broadcast("angularFireAuth:error",err);
    } else if (user) {
        this._authenticated = true;
        this._redirectTo = $route.current.pathTo;
        self._loggedIn(user)
    } else {
        this._authenticated = false;
        self._loggedOut();
    }
  });
  this._authClient = client;
},

这不起作用的唯一情况是当用户登录并导航到http：//< host> /#/ login时 – $route.current.pathTo将等于/ login,此刻我我不是100％肯定如何克服这一点.对Anant的任何想法？