.play()不使用$ watch在指令中触发

时间:2016-09-13 02:30:21

标签: javascript angularjs

我正在使用 buzz 来表达我的声音并且非常熟悉它的功能。但是,我和导师无法弄清楚为什么我的声音文件没有在我的指令中解雇。

我的指示:

(function() {
    function clockTimer($interval, $window, STOP_WATCH) {

        return {
            templateUrl: '/templates/directives/clock_timer.html',
            replace: true,
            restrict: 'E',
            scope: {},
            link: function(scope, element, attributes) {

                scope.STOP_WATCH = STOP_WATCH; //see constants in app.js
                scope.startButton = 'Start Work';
                scope.breakButton = 'Take Break';
                scope.onBreak = false;  //boolean for alternating displaying of work-time or break
                var mySound = new buzz.sound("/sounds/blue.mp3", {
                  formats: ['mp3'],
                  preload: true
                });

                // @desc initiates holder of completed work sessions.  Increments by 1 once timer hits 0
                var completedWorkSessions = 0;
                // @desc Holds state for $interval call
                var promise;

                scope.$watch('STOP_WATCH.totalWorkTime', function() {
                  if (scope.STOP_WATCH.totalWorkTime === 0) {
                    mySound.play();
                    console.log(mySound);
                    console.log("im listening");
                  }
                });

我的视图

<section class="clock-container">
<div ng-show="!onBreak === true"> {{ STOP_WATCH.totalWorkTime | clockFormat }}
  <button ng-click="startStopButton(startButton)" ng-show="!onBreak === true">{{ startButton }}</button>
</div>
<div ng-hide="onBreak === false"> {{ STOP_WATCH.totalBreakTime | clockFormat }}
  <button ng-click="takeBreakButton(breakButton)">{{ breakButton }}</button>
</div>
</section>

Buzz库包含在我的索引中,我尝试将scope添加到mySound的开头,在测试应用程序中测试.mp3(工作正常),但仍然无法让声音发挥。

以下是我的控制台,它表明$watch在假设为{<1}}时触发:

sound {sound: audio, volume: 80}
clockTimer.js:51 im listening

任何想法或解决方案?我没有任何控制器,并且认为自从它在控制台中成功发射后我不应该需要一个控制器?

1 个答案:

答案 0 :(得分:0)

我从buzz对象中删除了formats: ['mp3'],。您可以使用formats: ['mp3'],.mp3,但不能同时使用两者。