IdleProvider.windowInterrupt不是函數

我正試圖在我的devbox上獲得在node.js中工作的ng-Idle的最基本可能的實現。爲此，我已經採取the minimal sample shown at this link，以及在什麼是的node.js工作最小化安裝，這是我使用instructions which I have documented at a file sharing site at this link實施已經安裝了它。我所做的工作最小的Node.js應用是進入一個最低限度的工作程序，IdleProvider.windowInterrupt不是函數

1）Tyoe bower install ng-idle在客戶端應用程序
2）的根文件夾中註釋掉所有的舊index.html
3.）將以上代碼中的代碼粘貼到index.html中，並且只將url鏈接更改爲angular.js和angular-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>

來源

2016-02-16 CodeMed

對此深感抱歉。這種回購使用git-flow源控制技術，所以develop分支就是未發行工作順利，並master代表發佈分支。你看index.html包括如何使用已添加的一項功能，尚未正式發佈的又一個例子。

我將繼續釋放掛起的功能，但與此同時您可以刪除IdleProvider.windowInterrupt行，因爲這在1.1.1版中不可用。該版本的示例index.html位於master中。

我運行了你的例子，刪除了該行，它按預期工作。

來源

2016-02-17 08:55:36 HackedByChinese

當我解壓'tar'時，註釋掉一行，然後'grunt serve'，應用程序在瀏覽器中以未格式化的形式顯示，並且不提供完整的功能。你能否提出任何其他更改以使其能夠以應用示例的方式正常工作？這裏是一個GIF的鏈接顯示該應用程序的樣子後僅僅註釋掉一行，並鍵入'咕嚕serve'：https://jumpshare.com/v/JvceCRyu9knZmU8v0oCn – CodeMed

@CodeMed不知道你的意思。你提供的圖像表明它正在工作。也許你期待它看起來完全像演示... UI不是模塊的一部分;該模塊並不關心用戶界面，你必須自己連接這些東西。演示（http://hackedbychinese.github.io/ng-idle/）展示瞭如何使用它與'UI-bootstrap'顯示一個模式。 – HackedByChinese

謝謝。我試圖在使你的最小樣本工作後連接演示代碼，但它沒有有效的連線。如果我花20分鐘將其打開並現在上傳，您是否可以查看它？ – CodeMed

IdleProvider.windowInterrupt不是函數

回答

相關問題