无法运行AngularJS计时器示例
[英]Not able to run AngularJS timer example
问题描述
When i try to run the below example mentioned in the Angular JS timer site, I am getting error: 
当我尝试运行Angular JS计时器站点中提到的以下示例时，出现错误：
ng:areq
Bad Argument
Argument 'MyAppController' is not a function, got undefined
http://errors.angularjs.org/1.3.14/ng/areq?p0=MyAppController&p1=not%20a%20function%2C%20got%20undefined
at Error (native)
at file:///C:/ICDP/Angular/angular/angular.min.js:6:417
at Sb (file:///C:/ICDP/Angular/angular/angular.min.js:19:510)
at tb (file:///C:/ICDP/Angular/angular/angular.min.js:20:78)
at file:///C:/ICDP/Angular/angular/angular.min.js:75:331
at file:///C:/ICDP/Angular/angular/angular.min.js:57:65
<!DOCTYPE html>
<html>
<head>
<title>AngularJS Example - Multiple Timers Example</title>
<script src="../angular/angular.min.js"></script>
<script src="../app/js/timer.js"></script>
<script>
angular.module('MyApp', ['timer']);
function MyAppController($scope) {
$scope.timerRunning = true;
$scope.startTimer = function (){
$scope.$broadcast('timer-start');
$scope.timerRunning = true;
};
$scope.stopTimer = function (){
$scope.$broadcast('timer-stop');
$scope.timerRunning = false;
};
}
MyAppController.$inject = ['$scope'];
</script>
</head>
<body ng-app="MyApp">
<div ng-controller="MyAppController">
<h2>AngularJS - Multiple Timers Example</h2>
<h3>Timer 1: <timer/></h3>
<h3>Timer 2: <timer interval="2000"/></h3>
<h3>Timer 3: <timer> minutes, seconds.</timer></h3>
<button ng-click="startTimer()" ng-disabled="timerRunning">Start Timers</button>
<button ng-click="stopTimer()" ng-disabled="!timerRunning">Stop Timers</button>
</div>
</body>
</html>
I have the below two files included 我包含以下两个文件
<script src="../angular/angular.min.js"></script>
<script src="../app/js/timer.js"></script>
http://siddii.github.io/angular-timer/examples.html#/plain-javascript-source http://siddii.github.io/angular-timer/examples.html#/plain-javascript-source
2 个解决方案
解决方案1
1 2016-02-02 06:05:44
You have not MyAppController Controller . 您没有MyAppController Controller 。 You must tell angular that there is controller named MyAppController. 您必须告诉angular有一个名为MyAppController的控制器。 Try this to fix your problem. 尝试解决此问题。
angular.module('MyApp', ['timer']).controller('MyAppController', MyAppController);
And link that can be useful https://docs.angularjs.org/guide/controller 以及可能有用的链接https://docs.angularjs.org/guide/controller
解决方案2
1 已采纳 2016-02-02 06:06:11
Open Chrome developer tools(F12), then open folder with file: angular-timer -> examples -> angularjs-single-timer.html and you will see that (it is just little mistake): 打开Chrome开发人员工具（F12），然后打开包含文件的文件夹：angular-timer->示例-> angularjs-single-timer.html，您会发现（这只是一个小错误）：
<!DOCTYPE html>
<html>
<head>
<title>AngularJS Example - Single Timer Example</title>
<!-- compiled JavaScript -->
<script type="text/javascript" src="../dist/assets/js/angular-timer-bower.js"></script>
<script type="text/javascript" src="../dist/assets/js/angular-timer-all.min.js"></script>
<script>
angular.module('MyApp', ['timer'])
.controller('MyAppController', ['$scope', function ($scope) {
$scope.timerRunning = true;
$scope.startTimer = function (){
$scope.$broadcast('timer-start');
$scope.timerRunning = true;
};
$scope.stopTimer = function (){
$scope.$broadcast('timer-stop');
$scope.timerRunning = false;
};
$scope.$on('timer-stopped', function (event, data){
console.log('Timer Stopped - data = ', data);
});
}]);
</script>
</head>
<body ng-app="MyApp">
<div ng-controller="MyAppController">
<h1>AngularJS - Single Timer Example</h1>
<h3><timer/></h3>
<button ng-click="startTimer()" ng-disabled="timerRunning">Start Timer</button>
<button ng-click="stopTimer()" ng-disabled="!timerRunning">Stop Timer</button>
</div>
<br/>
</body>
</html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.