Create service for AccountBalances and use it.

src/accounts/account.component.ts

@@ -4,13 +4,22 @@ var accountFormTmpl = require('./account.form.tmpl.html'),
     accountDeleteTmpl = require('./account.delete.tmpl.html');
 
 import { Account } from './account';
+import { AccountBalances } from './accountBalances';
+import { AccountService } from './account.service';
+import { AccountBalancesService } from './accountBalances.service';
 
 export class AccountComponent {
-    static $inject = ['AccountService', 'AccountBalances', 'Notification', '$log', '$modal'];
+    static $inject = ['AccountService', 'AccountBalancesService', 'Notification', '$log', '$modal'];
 
     accounts: Account[];
 
-    constructor(private AccountService, private AccountBalances, private Notification, private $log, private $modal) {
+    constructor(
+        private AccountService: AccountService,
+        private AccountBalancesService: AccountBalancesService,
+        private Notification,
+        private $log,
+        private $modal
+    ) {
         // Load accounts.
         this.load();
     }
@@ -52,7 +61,11 @@ export class AccountComponent {
     load() {
         this.AccountService.query().subscribe(accounts => {
             this.accounts = accounts.map((account: Account) => {
-                account.balances = this.AccountBalances.get({id: account.id});
+                this.AccountBalancesService
+                    .get(account.id)
+                    .subscribe((accountBalances: AccountBalances) => {
+                        account.balances = accountBalances;
+                    })
                 return account;
             })
         });

src/accounts/account.module.ts

@@ -7,6 +7,7 @@ import { NgLoggerModule, Level } from '@nsalaun/ng-logger';
 import { RestangularModule } from 'ngx-restangular';
 
 import { AccountService } from './account.service';
+import { AccountBalancesService } from './accountBalances.service';
 
 @NgModule({
   imports: [
@@ -15,8 +16,9 @@ import { AccountService } from './account.service';
     RestangularModule
   ],
   providers: [
-    AccountService
+    AccountService,
-  ]
+    AccountBalancesService,
+  ],
 })
 export class AccountModule {}
 

src/accounts/accountBalances.service.ts

@@ -0,0 +1,18 @@
+// vim: set tw=80 ts=2 sw=2 sts=2 :
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs/Rx';
+
+import { Restangular } from "ngx-restangular";
+
+import { AccountBalances } from './accountBalances';
+
+@Injectable()
+export class AccountBalancesService {
+  constructor(
+    private restangular: Restangular
+  ) {}
+
+  get(id: number): Observable<AccountBalances> {
+    return this.restangular.one('account', id).one('balances').get();
+  }
+}

src/accounts/index.ts

@@ -29,7 +29,7 @@ var ngResource       = require('angular-resource'),
 
 var accountsTmpl = require('./accounts.html');
 
-import { AccountBalancesFactory } from './accountBalances.factory';
+import { AccountBalancesService } from './accountBalances.service';
 import { AccountService } from './account.service';
 import { AccountComponent } from './account.component';
 
@@ -40,7 +40,7 @@ export default angular.module('accountant.accounts', [
     ngStrap,
 ])
 
-    .factory('AccountBalances', AccountBalancesFactory)
+    .factory('AccountBalancesService', downgradeInjectable(AccountBalancesService))
 
     .factory('AccountService', downgradeInjectable(AccountService))