diff --git a/src/accounts/index.ts b/src/accounts/index.ts
index 94a3b05..5d461a5 100644
--- a/src/accounts/index.ts
+++ b/src/accounts/index.ts
@@ -27,6 +27,8 @@ var ngResource       = require('angular-resource'),
     ngUiNotification = require('angular-ui-notification'),
     ngStrap          = require('angular-strap');
 
+var accountsTmpl = require('./accounts.html');
+
 import { AccountBalancesFactory } from './accountBalances.factory';
 import { AccountService } from './account.service';
 import { AccountComponent } from './account.component';
@@ -42,6 +44,10 @@ export default angular.module('accountant.accounts', [
 
     .factory('AccountService', downgradeInjectable(AccountService))
 
-    .controller('AccountController', AccountComponent)
+    .component('accountList', {
+        controller: AccountComponent,
+        controllerAs: 'accountsCtrl',
+        templateUrl: accountsTmpl
+    })
 
     .name;
diff --git a/src/app.config.ts b/src/app.config.ts
index d99b853..3ce37b9 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -29,9 +29,7 @@ export default function AppConfig($uiRouterProvider) {
     $stateRegistry.register({
         name: 'accounts',
         url: '/accounts',
-        templateUrl: accountsTmpl,
-        controller: 'AccountController',
-        controllerAs: 'accountsCtrl'
+        component: 'accountList',
     });
 
     const $urlService = $uiRouterProvider.urlService;