2015-05-20 5 views
4

Я хочу, чтобы отобразить отсчитывать timer.I были со ссылкой на следующей странице http://siddii.github.io/angular-timer/Угловая Таймер не работает

Но я получаю ошибку ниже.

Error: Invalid isolate scope definition for directive timer: @?

Может ли кто-нибудь сказать мне, что я упускаю.

index.html

<!DOCTYPE html> 
<html ng-app="app"> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Insert title here</title> 
<script type="text/javascript" src="angular.min.js"></script> 
<script type="text/javascript" src="angular-timer.min.js"></script> 
<script type="text/javascript" src="app.js"></script> 
</head> 
<body> 
<timer end-time="1451628000000">{{days}} days, {{hours}} hours, {{minutes}} minutes, {{seconds}} seconds.</timer> 
</body> 
</html> 

app.js

var appModule=angular.module('app', ['timer']); 
+0

Какой версию угловых вы используете? –

ответ

13

Попробуйте это. Он работает:

Я добавил moment.js и humanizeDuration.js библиотеки, основанные на ошибках, которые я получал.

Надеется, что это помогает

<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.js"></script> 
 
    <script src="https://raw.githubusercontent.com/EvanHahn/HumanizeDuration.js/master/humanize-duration.js"></script> 
 
    <script src="https://raw.githubusercontent.com/siddii/angular-timer/master/dist/angular-timer.js"></script> 
 
    </head> 
 

 
    <body ng-app="app"> 
 

 
    <div ng-controller="ctrl"> 
 
     <timer end-time="1451628000000">{{days}} days, {{hours}} hours, {{minutes}} minutes, {{seconds}} seconds.</timer> 
 
\t </div> 
 
\t 
 
\t <script> 
 
\t var app = angular.module('app',['timer']); 
 
\t \t \t 
 
\t app.controller('ctrl', function($scope){}); 
 
\t </script> 
 
    </body> 
 
</html>

+0

Благодарим вас за ответ. –

+0

Я обновил угловое значение до AngularJS v1.1.4 и включил moment.js и humanize.js.Timer теперь отображается, но таймер не тикает. Таймер меняется только после обновления страницы. –

+0

У вас есть ошибки? Вы пробовали вышеуказанный рабочий HTML-код как есть? Попробуйте также: Angular 1.3.1 – JcDenton86

0
<!DOCTYPE html> 
<html ng-app="app" lang="en"> 
<head> 
<!-- <meta http-equiv="refresh" content="1" /> --> 
<title>Insert title here</title> 
<script type="text/javascript" src="angular.js"></script> 
<script type="text/javascript" src="angular-timer.min.js"></script> 
<script type="text/javascript" src="moment.js"></script> 
<script type="text/javascript" src="locales.min.js"></script> 
<script type="text/javascript" src="humanize-duration.js"></script> 


<script type="text/javascript" src="app.js"></script> 
</head> 
<body> 
<div> 
<timer end-time="1451628000000">{{days}} days, {{hours}} hours, {{minutes}} minutes, {{seconds}} seconds.</timer></div> 
</body> 
</html> 

Я получаю ниже выходные

224 дней, 23 часов, 12 минут, 56 секунд.

Но таймер не тикает Таймер становится изменен только при обновлении страницы

следующее сообщении об ошибке не видна в консоли

гуманизации-duration.js: 259 неперехваченной Ошибка: Нет язык неопределенного ,

2

Вам нужно потянуть в нужные библиотеки, чтобы таймер работал.

bower install momentjs --save 
bower install humanize-duration --save 

Теперь в вашем HTML добавить зависимости

<script type="text/javascript" src="bower_components/humanize-duration/humanize-duration.js"></script> 

<script type="text/javascript" src="bower_components/momentjs/min/moment-with-locales.min.js"></script> 
Смежные вопросы