我知道AngularJS会将一些代码运行两次,有时甚至更多,比如$watch events,不断检查模型状态等等。

然而我的代码:

function MyController($scope, User, local) {

var $scope.User = local.get(); // Get locally save user data

User.get({ id: $scope.User._id.$oid }, function(user) {
  $scope.User = new User(user);
  local.save($scope.User);
});

//...

执行两次,将2条记录插入到我的DB中。我显然还在学习,因为我已经用我的头撞它很多年了!


当前回答

我一直在用AngularJS 1.4 rc构建这个问题,然后意识到上面的答案都不适用,因为在撰写本文时,它起源于Angular 1.4和Angular 2的新路由器库。因此,我要在这里提醒那些可能正在使用新的Angular路由库的人。

基本上,如果一个html页面包含一个ng-viewport指令来加载你的应用程序的部分,通过点击ng-link中指定的超链接将导致相关组件的目标控制器被加载两次。细微的区别在于,如果浏览器已经加载了目标控制器,那么重新单击相同的超链接只会调用该控制器一次。

还没有找到可行的解决方案,尽管我相信这个行为与shaunxu提出的观察是一致的,希望这个问题能在未来的新路由库构建中以及AngularJS 1.4版本中得到解决。

其他回答

应用路由器指定导航到MyController,如下所示:

$routeProvider.when('/',
                   { templateUrl: 'pages/home.html',
                     controller: MyController });

但我在home。html中也有这个:

<div data-ng-controller="MyController">

这对控制器进行了两次消化。从HTML中删除data-ng-controller属性解决了这个问题。或者,controller:属性可以从路由指令中删除。

使用选项卡导航时也会出现此问题。例如,app.js可能包含:

  .state('tab.reports', {
    url: '/reports',
    views: {
      'tab-reports': {
        templateUrl: 'templates/tab-reports.html',
        controller: 'ReportsCtrl'
      }
    }
  })

相应的报告标签HTML可能类似于:

<ion-view view-title="Reports">
  <ion-content ng-controller="ReportsCtrl">

这也将导致运行控制器两次。

我刚刚讲过这个问题,但这个问题与公认的答案不同。我真的要把这些留给未来的自己,包括我为解决这个问题所采取的步骤。

Remove redundant controller declarations Check trailing slashes in routes Check for ng-ifs Check for any unnecessary wrapping ng-view calls (I accidentally had left in an ng-view that was wrapping my actual ng-view. This resulted in three calls to my controllers.) If you are on Rails, you should remove the turbolinks gem from your application.js file. I wasted a whole day to discover that. Found answer here. Initializing the app twice with ng-app and with bootstrap. Combating AngularJS executing controller twice When using $compile on whole element in 'link'-function of directive that also has its own controller defined and uses callbacks of this controller in template via ng-click etc. Found answer here.

在这里加上我的案例:

我使用angular-ui-router和$state。Go ('new_state', {foo: "foo@bar"})

一旦我将encodeURIComponent添加到参数中,问题就解决了:$state。go('new_state', {foo: encodeURIComponent("foo@bar")})。

发生了什么事? 参数值中的“@”字符不允许出现在url中。因此,angular-ui-router创建了我的控制器两次:在第一次创建时,它传递了原始的“foo@bar”,在第二次创建时,它将传递编码版本“foo%40bar”。一旦我像上面那样显式地对参数进行编码,问题就解决了。

在我的例子中,我发现使用相同控制器的两个视图。

$stateProvider.state('app', {
  url: '',
  views: {
    "viewOne@app": {
      controller: 'CtrlOne as CtrlOne',
      templateUrl: 'main/one.tpl.html'
    },
    "viewTwo@app": {
      controller: 'CtrlOne as CtrlOne',
      templateUrl: 'main/two.tpl.html'
    }
  }
});

我的问题真的很难找到。最后,当网页缺少图像时,问题就出现了。src缺少一个Url。这发生在MVC 5 Web控制器上。为了解决这个问题,当没有真实图像可用时,我添加了透明图像。

<img alt="" class="logo" src="">