Angularjs деление по пробелу не удается

Я использую angular-timer.Angularjs деление по пробелу не удается

Это работает:

{{ (seconds/10) * 100 }}

Но это один не делает:

{{ (seconds/secondsToAnswer) * 100 }

(это имеет значение NaN)

Однако, я поставил secondsToAnswer 10 в контроллере: $scope.secondsToAnswer = 10; Это происходит и вне директивы.

Полный код:

HTML

<timer interval="1000"> 
    <div class="progress"> 
    <div class="progress-bar progress-bar-info progress-bar-striped" 
     role="progressbar" 
     aria-valuenow="20" 
     aria-valuemin="0" 
     aria-valuemax="100" 
     style="width: {{ (seconds/secondsToAnswer) * 100 }}%"> 
    </div> 
    </div> 
</timer>

'use strict'; 

vocabApp.controller('PracticeController', function ($scope) { 

    $scope.expressions = [ 
    { expression:'cat', meaning:'macska' }, 
    { expression:'dog', meaning:'kutya' }, 
    { expression:'whale', meaning:'bálna' } 
    ]; 

    //$scope.timerRunning = true; 

    $scope.startTimer = function() { 
    $scope.secondsToAnswer = 10; 
    $scope.$broadcast('timer-start'); 
    $scope.timerRunning = true; 
    }; 

    $scope.stopTimer = function() { 
    $scope.$broadcast('timer-stop'); 
    $scope.timerRunning = false; 
    }; 

    $scope.$on('timer-stopped', function (event, args) { 
    console.log('timer-stopped args = ', args); 
    }); 

})

источник

2014-10-07 Tyler Durden

Я предполагаю, что это вопрос времени. Выражение страницы {{...}} оценивается до того, как уходит секунда. Попробуйте сделать secondToAnswer функцией, которая возвращает интересующее вас значение. – Scott

@Scott Спасибо, я пробовал, но это что-то еще. –

Трудно прочитать их пример кода из-за того, что все угловые скобки изменены на < на git. Но мне интересно, не проблема в том, что область вашего контроллера, которая устанавливает переменную secondsToAnswer и область действия директивы, которая устанавливает секунды, не подключена. –

Это происходит потому, что $scope.secondsToAnswer = 10; будет выполняться только тогда, когда StartTimer работает, до тех пор пока это время $scope.secondsToAnswer будет неопределенным ,

Если вы сделаете $scope.secondsToAnswer = 10; первой строкой в своем контроллере, тогда она должна работать.

источник

2014-10-08 07:45:52

Я думаю, что это была первая строка, когда проблема возникла впервые, но я проверю ее, когда вернусь домой. –

Нет, это не то, что –

Это то, что плюс еще что-то :) Я не знаю, закончен ли ваш исходный код, но нет слова для 'секунд'. Вы можете сделать 'console.log ($ scope.seconds);' в начале вашего контроллера, чтобы узнать, имеет ли оно какое-то значение. –

Я думаю, проблема возникает из двух мест. Сначала как Sander_P указал, $scope.secondsToAnswer должен быть определен в верхней части вашего контроллера, а не внутри функции startTimer. Теперь другое дело в том, что ваш контроллер обертывает директиву timer, но на самом деле должен быть внутри него.

Например:

<timer interval="1000"> 
     <div ng-controller="PracticeController" class="progress"> 
      <div class="progress-bar progress-bar-info progress-bar-striped" 
       role="progressbar" 
       aria-valuenow="20" 
       aria-valuemin="0" 
       aria-valuemax="100" 
       style="width: {{ (seconds/secondsToAnswer) * 100 }}%"> 
      </div> 
     </div> 
    </timer>

I made a working jsfiddle demo here:

var vocabApp = angular.module("APP", ['timer']); 
vocabApp.controller('PracticeController', function ($scope) { 

    $scope.secondsToAnswer = 100; 

    $scope.expressions = [{ 
     expression: 'cat', 
     meaning: 'macska' 
    }, { 
     expression: 'dog', 
     meaning: 'kutya' 
    }, { 
     expression: 'whale', 
     meaning: 'bálna' 
    }]; 

    //$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, args) { 
     console.log('timer-stopped args = ', args); 
    }); 

});

источник

2014-10-12 01:01:28 axelduch

Две вещи

в $ scope.secondsToAnswer должно быть объявлен вне функции глобально не при вызове startTimer.
В коде HTML вы должны обернуть область, в которой вам нужно использовать область действия. В этом случае внутри директивы таймера

источник

2014-10-15 08:37:06 geckob

Angularjs деление по пробелу не удается

ответ

Смежные вопросы