AngularJs on-click 未在基本模板中触发

Question

我正在使用 AngularJs 和 Firebase，尝试让 Angularfire 用户身份验证正常工作。但是遇到了一些问题。

所以我在导航中有一个 on-click 事件，它将弹出用户身份验证 windows。

index.html

<ul class="nav navbar-nav navbar-right">
   <li><a href="#/">Home</a></li>
   <li ng-hide="authData"><a href="" ng-click="auth.$authWithOAuthPopup('google')">Login</a></li>
   <li ng-show="authData"><a href="" ng-click="auth.$unauth()">Logout</a></li>
</ul>

app.js

app.factory("Auth", ["$firebaseAuth", function($firebaseAuth){
  return $firebaseAuth(ref);
}]);

app.controller("HomeCtrl", ["$scope", "Auth", "currentAuth", function($scope, Auth, currentAuth) {
  $scope.auth = Auth;
  $scope.auth.$onAuth(function(authData) {
    $scope.authData = authData;
  });
}]);

$stateProvider.state("home", {
  controller: "HomeCtrl",
  url: "/",
  templateUrl: "partials/home.html",
  resolve: {
     "currentAuth": ["Auth", function(Auth) {
        return Auth.$waitForAuth();
    }]
  }
})

当我点击导航中的 Login 时没有任何反应，但如果我将代码作为部分文件加载到 ui-view，那么它就可以工作了。

如何修复它，使每个页面的导航都一样。我有一个临时解决方案，即将 body 中的所有内容作为部分加载。但这意味着我必须在每个部分重复我的导航代码，我不想那样做。

是的...我在导航上试过 ng-controller="HomeCtrl"，没有必要这样做。（参见此处：）

编辑：Plunker

上的示例代码

Answer 1

如果导航栏在 ui-view 之外，那么它不受 ui-router 绑定到 ui-view 的控制器的影响。您应该有一个单独的控制器，即 navbarController，它可以使用 ng-controller 静态绑定到导航栏元素，与 ui-view 分开。在该控制器中，您可以添加所有页面上可见的所有共享代码。在导航栏上添加 HomeCtrl 实际上也不起作用，因为那样的话页面上将只有同一控制器的两个实例。

Answer 2

所以我为导航栏创建了一个指令并将其加载到基本模板上，现在可以使用了

AngularJs on-click 未在基本模板中触发

AngularJs on-click not firing in base template

javascript

angularjs

firebase

angularfire