Question

我的角度应用程序有一个非常简单的js文件。

angular.module('Account', ['firebase'])

  .value('fbURL', 'https://myURL.firebaseio.com/')

  .service('fbRef', function(fbURL) {
     return new Firebase(fbURL)
  })

  .controller('Authorization', function($scope, $firebase, $firebaseObject, fbRef){

      var auth = this;

      auth.loginEnabled = function() {

        alert('false');

        return false;
      } 

      auth.loginEmail = function() {


      }

  });

当我的html加载时，auth.loginEnabled函数被多次调用（警报出现多次）。这是为什么？

在我的HTML中

ng-app在我的html标签中声明为ng-app =＆＃34; Account＆＃34;
ng-controller在我的<div class="container">中包含了一个包含if for angular
ng-if被声明两次，一次是真正的返回，一次是假的。

简而言之，这是我的HTML代码:(所有缺少的是上面描述的ng-app代码）

<div class="container login-container" ng-controller="Authorization as auth">
            <div class="row">
                <div class="col-sm-12">
                    <form class="" action="" method="">
                        <div class="card-container manual-flip">
                            <div class="card">
                                <div class="front">
                                    <div class="cover">
                                        <img src="<?php echo $base; ?>assets/img/rotating_card_thumb2.png"/>
                                    </div>
                                    <div class="content" ng-if="auth.loginEnabled()">
                                        <div class="main">
                                            <h3 class="name">Login</h3>
                                            <p class="profession">My Account</p>
                                            <div class="form-group">
                                                <input type="email" ng-model="email" class="form-control" placeholder="E-mail Address">
                                            </div>
                                            <div class="form-group">
                                                <input type="password" ng-model="password" class="form-control" placeholder="Password">
                                            </div>
                                        </div>
                                        <div class="footer">
                                            <button type="submit" class="btn btn-block btn-primary">Login <i class="fa fa-arrow-right"></i></button>
                                        </div>
                                    </div>
                                    <div class="content" ng-if="!auth.loginEnabled()">
                                        <div class="main">
                                            <h3 class="name">Login</h3>
                                            <p class="profession">Temporarily Unavailable</p>
                                            <p class="text-center">We are currently updating our system for a better user experience! Please check back within a few hours.</p>
                                        </div>
                                        <div class="footer">
                                            <a href="<?php echo $base; ?>" class="btn btn-block btn-primary"><i class="fa fa-reply"></i> Return Home</a>
                                        </div>
                                    </div>
                                    <div class="back">

                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>

我想在某些时候一起禁用登录功能，而不是看用户是否已经登录。

Answer 1

正如奥雷尔所提到的，重复警报的原因仅仅是每个摘要周期都会调用loginEnabled函数。在没有太多细节的情况下，Angular经常重新评估绑定到范围的那些函数和值，以确保您的UI准确地表示您的数据。

因此，最好将loginEnabled值分配给范围内的布尔和查询：

auth.loginEnabled = false;

$rootScope.$on('myAuthenticationEvent', function () {
  auth.loginEnabled = true;
});

$ rootScope的使用不是必需的，但可用于证明控制器中的某些其他功能（可能是Firebase观察者）可能负责更新您的auth.loginEnabled值。希望这有帮助！

Answer 2

原因是你的控制器被调用了两次，可能是因为这个

您的视图中提到了

ng-controller="Authorization as auth，并且在配置路线时，您也可能还包含控制器。如下所示

                 url: '/your url',
                 config: {
                     templateUrl: 'url',
                     controllerUrl: 'url',
                     controller:'Authorization'
                 }

如果是这种情况，请将代码更改为

                 url: '/your url',
                 config: {
                     templateUrl: 'url',
                     controllerUrl: 'url',
                 }

AngularJS函数被多次调用？

2 个答案: