IdleProvider.windowInterrupt不是一个函数

时间:2016-02-16 23:34:18

标签: javascript angularjs node.js gruntjs yeoman

我正在尝试在我的devbox上ng-Idle中使用node.js最基本的可能实现。为此,我采用了the minimal sample shown at this link,并将其安装在node.js的最小工作安装中,我使用instructions which I have documented at a file sharing site at this link实现了这一安装。我所做的只是工作的最小node.js应用程序是进入一个极简主义的工作应用程序,

1。)Tyoe bower install ng-idle在客户端应用程序的根文件夹中 2.)注释掉所有旧的index.html 3.)将以上链接中的代码粘贴到index.html,并仅将angular.jsangular-idle.min.js的网址链接更改为项目中这些文件的实际相对路径。 (我确认这两个链接都指向实际的js库 4.)在应用程序所在的客户端文件夹的根目录中键入grunt serve

以上步骤在网络浏览器中启动了该应用,但出现了以下编译错误:

Error: [$injector:modulerr] Failed to instantiate module demo due to:
IdleProvider.windowInterrupt is not a function
@http://localhost:9000/:122:9  

如果有人对重新创建此简单问题的完整工作应用感兴趣,我会将其放入a tar ball and posted it to a file sharing site, which you can download by clicking on this link

需要采取哪些具体步骤来解决此错误,以便ng-idle可以在node.js的这个基本安装中运行?

以下是index.html

<html ng-app="demo">
  <head>
    <title title>NgIdle Sample</title>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/ng-idle/angular-idle.min.js"></script>

   <script type="text/javascript">
      var app = angular.module('demo', ['ngIdle']);
      app
      .controller('EventsCtrl', function($scope, Idle) {
        $scope.events = [];
        $scope.idle = 5;
        $scope.timeout = 5;
        $scope.$on('IdleStart', function() {
          addEvent({event: 'IdleStart', date: new Date()});
        });
        $scope.$on('IdleEnd', function() {
          addEvent({event: 'IdleEnd', date: new Date()});
        });
        $scope.$on('IdleWarn', function(e, countdown) {
          addEvent({event: 'IdleWarn', date: new Date(), countdown: countdown});
        });
        $scope.$on('IdleTimeout', function() {
          addEvent({event: 'IdleTimeout', date: new Date()});
        });
        $scope.$on('Keepalive', function() {
          addEvent({event: 'Keepalive', date: new Date()});
        });
        function addEvent(evt) {
          $scope.$evalAsync(function() {
            $scope.events.push(evt);
          })
        }
        $scope.reset = function() {
          Idle.watch();
        }
        $scope.$watch('idle', function(value) {
          if (value !== null) Idle.setIdle(value);
        });
        $scope.$watch('timeout', function(value) {
          if (value !== null) Idle.setTimeout(value);
        });
      })
      .config(function(IdleProvider, KeepaliveProvider) {
        KeepaliveProvider.interval(10);
        IdleProvider.windowInterrupt('focus');
      })
      .run(function($rootScope, Idle, $log, Keepalive){
        Idle.watch();
        $log.debug('app started.');
      });
    </script>
  </head>
  <body ng-controller="EventsCtrl">
    <div idle-countdown="countdown">
      <h1>Idle and Keepalive events</h1>
      <button type="button" ng-click="reset()">Reset manually</button>
      <ul>
        <li ng-repeat="event in events">{{event}}</li>
      </ul>

      <div idle-countdown="countdown">
        Timeout in {{countdown}} seconds.
      </div>

      <div>
        Change idle value <input type="number" ng-model="idle" />
      </div>
      <div>
        Change timeout value <input type="number" ng-model="timeout" />
      </div>
    </div>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

很抱歉。该repo使用git-flow源代码控制技术,因此develop分支是未发布的工作,而master代表发布分支。您正在查看的index.html包含一个示例,说明如何使用尚未正式发布的已添加的功能。

我将继续发布待处理的功能,但在此期间您可以删除IdleProvider.windowInterrupt行,因为版本1.1.1中没有。发布中的示例index.html位于master

我在删除该行的情况下运行了您的示例,它按预期工作。