23

我是 Angular js 的新手,目前遇到了一个非常有线的错误。控制器中的函数在被视图调用时运行两次,该视图针对路由加载。

http://jsfiddle.net/4gwG3/5/

你会看到两次警报!

我的观点很简单

我的应用程序代码如下

var IB = angular.module('IB', []);    

//channel controller
IB.controller('channelsController', function ($scope, $routeParams) {
    $scope.greet = function () {
        alert('hi');
    };
});


IB.config(function ($routeProvider) {
    $routeProvider
    .when('/channels', {
        controller: 'channelsController',
        template: '{{greet()}}'
    })

    .otherwise({ redirectTo: '/channels' });

});
4

4 回答 4

51

首先检查您是否没有两次初始化您的 Angular 应用程序(通过使用ng-app自动初始化它)。

有一次我有 2 个带有 ng-app 的 html 页面(一个用于 login.html,另一个用于 main.html),这是我后来意识到的一个问题。

其次,对我来说最重要的是,检查您是否已将控制器连接到多个元素。如果您使用路由,这是一种常见情况。

就我而言,我正在导航到 DashboardController ,如下所示:

app.config(function($routeProvider){
    $routeProvider
    .when('/', {
        controller: 'DashboardController',
        templateUrl: 'pages/dashboard.html'
    })
});

但我在dashboard.html中也有这个:

<section class="content" ng-controller="DashboardController">

这是指示 AngularJS 消化我的控制器两次。

要解决它,您有两种方法:

从您的 html 文件中删除ng-controller ,如下所示:

<section class="content">

或从路由中删除控制器(通常位于 app.js 中):

app.config(function($routeProvider){
$routeProvider
        .when('/', {
            templateUrl: 'pages/dashboard.html'
        })
    });
于 2015-02-26T15:28:14.137 回答
3

我认为通过创建插值{{greet()}},您可以创建一个监视函数greet。该函数可以在摘要循环运行时多次调用,因此运行 1 或 2 次不是问题。所以你不应该依赖函数被调用的时间。

于 2013-10-26T17:02:35.457 回答
0

我不知道你想在这里实现什么。有两个警报 1. 当controller被调用时。2. 当template被评估时。

template是提供视图部分,但是,在这种情况下,模板只是评估函数,它不会创建任何视图。

于 2013-10-26T17:32:49.060 回答
-1

我有同样的问题,所以我做了:

$scope.init=function()
{
    if ($rootScope.shopInit==true) return;
    $rootScope.shopInit=true;
    ...
}
$scope.init();

就像它是一个单身人士一样!(每次显示我都有很多ajax调用,很无聊)

于 2013-12-07T16:20:37.043 回答