diff --git a/client/core/src/components/submit/submit.html b/client/core/src/components/submit/submit.html
index 378920de0..6e77e4c16 100644
--- a/client/core/src/components/submit/submit.html
+++ b/client/core/src/components/submit/submit.html
@@ -1,7 +1,6 @@
 <input
+    class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored"
     type="submit"
-    class="*[className]*"
-    translate-attr="{value: '*[label]*'}"
-    value="*[label]*"
-    *[enabled]*>
+    translate-attr="{value: $ctrl.label}"
+    value="$ctrl.label">
 </input>
diff --git a/client/core/src/components/submit/submit.js b/client/core/src/components/submit/submit.js
index 6eb67dea8..15498a071 100644
--- a/client/core/src/components/submit/submit.js
+++ b/client/core/src/components/submit/submit.js
@@ -1,16 +1,24 @@
 import ngModule from '../../module';
-import template from './submit.html';
 
-directive.$inject = ['vnTemplate'];
-export default function directive(vnTemplate) {
-    return {
-        restrict: 'E',
-        template: (_, $attrs) =>
-            vnTemplate.get(template, $attrs, {
-                label: 'Submit',
-                className: 'mdl-button mdl-js-button mdl-button--raised mdl-button--colored',
-                enabled: 'true'
-            })
-    };
+export default class Controller {
+    constructor($element) {
+        this.$element = $element;
+        console.log($element);
+        this.input = $element[0].querySelector('input');
+    }
+
+    set disabled(value) {
+        this.input.disabled = value;
+    }
 }
-ngModule.directive('vnSubmit', directive);
+
+Controller.$inject = ['$element'];
+
+ngModule.component('vnSubmit', {
+    template: require('./submit.html'),
+    controller: Controller,
+    bindings: {
+        label: '@?',
+        disabled: '<?',
+    }
+});