diff --git a/templates/app/client/app/account(auth)/settings/index.js b/templates/app/client/app/account(auth)/settings/index.js
deleted file mode 100644
index 6b5eddabe..000000000
--- a/templates/app/client/app/account(auth)/settings/index.js
+++ /dev/null
@@ -1,7 +0,0 @@
-'use strict';
-import angular from 'angular';
-import SettingsController from './settings.controller';
-
-export default angular.module('<%= scriptAppName %>.settings', [])
- .controller('SettingsController', SettingsController)
- .name;
diff --git a/templates/app/client/app/account(auth)/settings/settings(pug).pug b/templates/app/client/app/account(auth)/settings/settings(pug).pug
deleted file mode 100644
index fc4bee87f..000000000
--- a/templates/app/client/app/account(auth)/settings/settings(pug).pug
+++ /dev/null
@@ -1,35 +0,0 @@
-.container
- .row
- .col-sm-12
- h1 Change Password
- .col-sm-12
- form.form(name='form', ng-submit='vm.changePassword(form)', novalidate='')
- .form-group
- label Current Password
- input.form-control(type='password'
- name='password'
- ng-model='vm.user.oldPassword'
- mongoose-error='')
- p.help-block(ng-show='form.password.$error.mongoose')
- | {{ vm.errors.other }}
- .form-group
- label New Password
- input.form-control(type='password'
- name='newPassword'
- ng-model='vm.user.newPassword'
- ng-minlength='3', required='')
- p.help-block(ng-show='(form.newPassword.$error.minlength || form.newPassword.$error.required) && (form.newPassword.$dirty || vm.submitted)')
- | Password must be at least 3 characters.
- .form-group
- label Confirm New Password
- input.form-control(type='password'
- name='confirmPassword'
- ng-model='vm.user.confirmPassword'
- match="vm.user.newPassword"
- ng-minlength='3', required='')
- p.help-block(ng-show='fvm.orm.confirmPassword.$error.match && vm.submitted')
- | Passwords must match.
-
- p.help-block {{ vm.message }}
-
- button.btn.btn-lg.btn-primary(type='submit') Save changes
diff --git a/templates/app/client/app/account(auth)/settings/settings.component.js b/templates/app/client/app/account(auth)/settings/settings.component.js
new file mode 100644
index 000000000..389bee9be
--- /dev/null
+++ b/templates/app/client/app/account(auth)/settings/settings.component.js
@@ -0,0 +1,55 @@
+import { Component } from '@angular/core';
+import { AuthService } from '../../../components/auth/auth.service';
+
+// @flow
+<%_ if(filters.flow) { -%>
+type User = {
+ oldPassword: string;
+ newPassword: string;
+ confirmPassword: string;
+};
+<%_ } -%>
+<%_ if(filters.ts) { -%>
+interface User {
+ oldPassword: string;
+ newPassword: string;
+ confirmPassword: string;
+}
+<%_ } -%>
+
+@Component({
+ selector: 'settings',
+ template: require('./settings.<%=templateExt%>'),
+})
+export class SettingsComponent {
+ user: User = {
+ oldPassword: '',
+ newPassword: '',
+ confirmPassword: ''
+ };
+ errors = {other: undefined};
+ message = '';
+ submitted = false;
+ AuthService;
+
+ static parameters = [AuthService];
+ constructor(_AuthService_: AuthService) {
+ this.AuthService = _AuthService_;
+ }
+
+ changePassword(form) {
+ if(form.invalid) return;
+
+ this.submitted = true;
+
+ return this.AuthService.changePassword(this.user.oldPassword, this.user.newPassword)
+ .then(() => {
+ this.message = 'Password successfully changed.';
+ })
+ .catch(() => {
+ // form.password.$setValidity('mongoose', false);
+ this.errors.other = 'Incorrect password';
+ this.message = '';
+ });
+ }
+}
diff --git a/templates/app/client/app/account(auth)/settings/settings.controller.js b/templates/app/client/app/account(auth)/settings/settings.controller.js
deleted file mode 100644
index d6316b7a5..000000000
--- a/templates/app/client/app/account(auth)/settings/settings.controller.js
+++ /dev/null
@@ -1,49 +0,0 @@
-'use strict';
-// @flow
-<%_ if(filters.flow) { -%>
-type User = {
- oldPassword: string;
- newPassword: string;
- confirmPassword: string;
-};
-<%_ } -%>
-<%_ if(filters.ts) { -%>
-interface User {
- oldPassword: string;
- newPassword: string;
- confirmPassword: string;
-}
-<%_ } -%>
-
-export default class SettingsController {
- user: User = {
- oldPassword: '',
- newPassword: '',
- confirmPassword: ''
- };
- errors = {other: undefined};
- message = '';
- submitted = false;
- Auth;
-
- /*@ngInject*/
- constructor(Auth) {
- this.Auth = Auth;
- }
-
- changePassword(form) {
- this.submitted = true;
-
- if(form.$valid) {
- this.Auth.changePassword(this.user.oldPassword, this.user.newPassword)
- .then(() => {
- this.message = 'Password successfully changed.';
- })
- .catch(() => {
- form.password.$setValidity('mongoose', false);
- this.errors.other = 'Incorrect password';
- this.message = '';
- });
- }
- }
-}
diff --git a/templates/app/client/app/account(auth)/settings/settings(html).html b/templates/app/client/app/account(auth)/settings/settings.html
similarity index 54%
rename from templates/app/client/app/account(auth)/settings/settings(html).html
rename to templates/app/client/app/account(auth)/settings/settings.html
index 690b0cf3f..c8e36ba35 100644
--- a/templates/app/client/app/account(auth)/settings/settings(html).html
+++ b/templates/app/client/app/account(auth)/settings/settings.html
@@ -4,26 +4,24 @@
Change Password
diff --git a/templates/app/client/app/account(auth)/signup/index.js b/templates/app/client/app/account(auth)/signup/index.js
deleted file mode 100644
index b95da83e1..000000000
--- a/templates/app/client/app/account(auth)/signup/index.js
+++ /dev/null
@@ -1,7 +0,0 @@
-'use strict';
-import angular from 'angular';
-import SignupController from './signup.controller';
-
-export default angular.module('<%= scriptAppName %>.signup', [])
- .controller('SignupController', SignupController)
- .name;
diff --git a/templates/app/client/app/account(auth)/signup/signup(html).html b/templates/app/client/app/account(auth)/signup/signup(html).html
deleted file mode 100644
index 6b6cad4b7..000000000
--- a/templates/app/client/app/account(auth)/signup/signup(html).html
+++ /dev/null
@@ -1,86 +0,0 @@
-