6

私は AngularJS を初めて使用するので、まったく間違った質問をしている可能性があります。私が達成しようとしているのは、単一のアプリでデータ バインディングを使用して再利用可能なクラスを作成することです。以下は、非常に単純な例で私が達成しようとしていることを示しています。

値とインクリメント メソッドを使用してカウンターを作成するとします。サービスを作成し、次のようにコントローラーで使用できます。

angular.module("fiddle", ["counter"])
.controller("MainCtrl", function($scope, counter) {
    $scope.counter = counter;
});

angular.module("counter", [])
.service("counter", function() {
    this.count = 0;
    this.increment = function(x) {
        this.count += x;
    };
});

次に、カウンターを追加するビューを表示できます。

<h1>Count: {{counter.count}}</h1>
<button ng-click="counter.increment(1)">Add 1</button>
<button ng-click="counter.increment(5)">Add 5</button>
<button ng-click="counter.increment(10)">Add 10</button>

これは 1 つのカウンターには問題なく機能しますが、同じコントローラーに複数のカウンターを配置したい場合はどうすればよいでしょうか? サービスはシングルトンなので、それはできません。他のサービスがはるかに複雑になることを考えると、Angular でこのようなものを作成するための最良のアプローチは何ですか? ありがとう!

http://jsfiddle.net/jeffaudio/ExASb/

4

2 に答える 2