title: angular-schema-form: Add custom html to form fields
body: <p>I have just started to look into angular-schema-form, so this might be something I've missed in the docs or description.</p>
  
  <p>What I am trying to do is to add an icon next to the label of generated form fields and next to the field itself. Like so:</p>
  
  <p><a href="https://i.stack.imgur.com/Fj8XO.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Fj8XO.png" alt="Regular input field"></a></p>
  
  <p>But out of the box angular-schema-form will generate:</p>
  
  <p><a href="https://i.stack.imgur.com/Vmhdj.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Vmhdj.png" alt="Generated input field"></a></p>
  
  <p>I know I can make my own custom field types, but is that the way to go? That would require me to redefine all field types in a custom variant, because I need these two icons and their functionality on all my form fields.</p>
  
  <p>I was hoping there were an easier way to add this functionality to generated html, and an easy way to add functionality (ng-click function) on them.</p>
  
  <p>Edit: After reading through the docs again, I've figured out that I need to define my own custom field type (<a href="https://github.com/Textalk/angular-schema-form/blob/development/docs/extending.md" rel="noreferrer">https://github.com/Textalk/angular-schema-form/blob/development/docs/extending.md</a>)</p>
  
  <p>From what I gather, I need to add the following to my modules config block:</p>
  
  <pre><code>schemaFormDecoratorsProvider.addMapping(
      'bootstrapDecorator',
      'custominput',
      'shared/templates/customInput.tpl.html',
      sfBuilderProvider.builders.sfField
  );
  </code></pre>
  
  <p>I have also added the contents of <code>shared/templates/customInput.tpl.html</code> to <code>$templatesCache</code>.</p>
  
  <p>But when I try to render a form, with a schema like</p>
  
  <pre><code>"schema": {
      "type": "object",
      "properties": {
          "firstName": {
              "title": "First name",
              "type": "string"
          },
          "lastName": {
              "title": "Last name",
              "type": "custominput"
          },
          "age": {
              "title": "Age",
              "type": "number"
          }
      }
  }
  </code></pre>
  
  <p>I only see the first field (firstName) and age. The custom type is just ignored.</p>
  
  <p>I have tried to debug my way to the problem, but as far as I can see, the custom field is correctly added to the decorator. I've tried to console.log the <code>schemaFormDecoratorsProvider.decorator()</code> and there I can see my custom field type.</p>
  
  <p>I've also tried to fire off a <code>$scope.$broadcast('schemaFormRedraw')</code> in my controller, but I still only see the built in field types.</p>
  
  <p>As a test, I've tried to define my own decorator, overwriting the default Bootstrap decorator:</p>
  
  <pre><code>schemaFormDecoratorsProvider.defineDecorator('bootstrapDecorator', {           
      'customType': {template: 'shared/templates/customInput.tpl.html', builder: sfBuilderProvider.stdBuilders},
      // The default is special, if the builder can't find a match it uses the default template.
      'default': {template: 'shared/templates/customInput.tpl.html', builder: sfBuilderProvider.stdBuilders},
  }, []);
  </code></pre>
  
  <p>I would expect to see all fields to be rendered the same, since I only define a default type and my own custom type. But still, I only see built in types rendered, my custominput is till just ignored.</p>
  
  <p>What am I missing?</p>