Как мне продолжать вызывать $ broadcast, когда мышь находится на кнопке в AngularJS? - PullRequest
0 голосов
/ 21 февраля 2019

У меня в настоящее время есть кнопка вида

<button id="scale-up" ng-click="scaleUp()">Scale Up</button>

Где «scaleUp ()» просто

$scope.scaleUp = () => { $scope.$broadcast('scaleUp'); };

Вместо того, чтобы вызывать «scaleUp ()» только один раз, яЯ хотел бы продолжать трансляцию 'scaleUp', пока мышь нажимает на кнопку.пр) Мышь не работает в течение 5 секунд, затем $ scope. $ broadcast ('scaleUp') следует вызывать 10 раз.

Каков правильный подход к реализации этого?Нет решений JQuery, пожалуйста.

1 Ответ

0 голосов
/ 21 февраля 2019

Как и все в AngularJS, есть несколько способов сделать это, но вот достойное решение, использующее $interval, ng-mousedown и ng-mouseup

Идея состоит в том, чтобы установить интервал, который будет продолжать вещание на мышинажимайте (ng-mousedown) каждые 0,5 секунды, пока не отпустите кнопку (ng-mouseup), где вы очистите свой интервал.

HTML:

    <button ng-mousedown="broadcastStuff()" ng-mouseup="stopBroadcasting()">
        Test
    </button>

    <h3>
        {{ h2test }}
    </h3>

JS:

  const broadcastDate = () => {
     $scope.$broadcast('scaleUp', new Date());
  };

  $scope.$on('scaleUp', (event, newVal)=>{
    $scope.h2test = newVal;
  })

  $scope.broadcastStuff = () => {
    $scope.stopInterval = $interval(broadcastDate, 500);

  }
  $scope.stopBroadcasting = () => {
     $interval.cancel($scope.stopInterval);
  };

Я создал скрипку для вас:

https://jsfiddle.net/pegla/n7s1c9u0/1/

...