0

フレームワークを学ぶためだけに、AngularJS で時間追跡アプリを作成しています。「追加」ボタンをクリックして、単一のビュー内に複数のタイマーを追加する機能を作成しようとしています。各タイマーには、明らかに、タイミング機能のための固有のプロパティと固有のメソッドが含まれます。そのようなことを行うためのサービスをどのように設定できるかについて、頭を悩ませています。どんな助けでも大歓迎です。

4

2 に答える 2

1

@Chandermani が述べたように、タイマーをディレクティブ内にラップする必要があります。これで始められるはずです:

Javascript

app.controller('MainCtrl', function($scope) {
  $scope.timers = [];
})
.directive('timer', function() {
  return {
    restrict: 'E', 
    template: '<h1>{{counter}}s</h1>',
    controller: function($scope, $timeout) {
      $scope.counter = 0;

      var callback = function() {
        $scope.counter++;
        $timeout(callback, 1000);
      };

      $timeout(callback, 1000);
    }
  };
});

HTML

<body ng-controller="MainCtrl">
    <button ng-click="timers.push(1)">Add timer</button>
    <timer ng-repeat="timer in timers"></timer>
</body>

ここでプランカー。

ディレクティブは、配列内の各アイテムに対してディレクティブの1ng-repeatつのインスタンスをレンダリングします。この不自然な例では、一度にいくつのタイマーが存在するかを制御する以外に、その配列には何の目的もありません。これを使用して、各タイマーに関する情報を個別に保存できます。timertimers

于 2013-09-16T19:18:51.313 に答える