How can I register a custom AngularJs parser directive in an embedded form?

I have some custom validation I’d like to apply via a directive in an embedded form, but cannot work out how to register the directive. I tried registering it to the “cam.embedded.forms” module in the embedded form’s <script> section but it does not get called when the form is used in Tasklist. It works fine when I work it into the standalone sample app.

<script cam-script type="text/form-script">
angular.module("cam.embedded.forms").directive("hasBank", function() {
    return {
      restrict: "A",
      require: "ngModel",
      link: function(scope, element, attributes, control) {
        function hasBankParser(value) {
            // parser logic
        }
        control.$parsers.push(hasBankParser);
      }
    };
  });
</script>

I think the problem is that this code is run during the run phase of the angular app and directives are supposed to be registered in the config phase.

Can anyone tell me how to do this or point me to a sample?

Bumping this to see if there are any thoughts on it.

I am aware of the ability to add custom scripts (including directives) to the tasklist config.js but was hoping there was a way to do this which was/is specific to a solution/task (and deployable with the task form) rather than part of the tasklist infrastructure. Considering how integral directives etc are to AngularJs, adding them to the tasklist does not seem like a sustainable or manageable solution long-term - tasklist will get bogged down with hundreds+ of directives which it doesn’t need for most tasks.

HI @Ettery
you should check out this page in the documentation. You need to customize the configuration of the tasklist to register new directives successfully. It would be very hard to do so within the embedded form itself.
If you are not sure how to customize the tasklist and set this custom configuration, you might also check out this Project: https://github.com/camunda-consulting/code/tree/master/snippets/camunda-webapp-customized

Hope this helps
Best
Felix

Thanks Felix, yes I am aware of the ability to register directives by customising the Tasklist config.js, and have got a fore working that way. However, custom directives are things you need to add to every AngularJs form;

  1. what happens when I have 100, 200 Camunda user forms? I could have 500 directives registered which are going to be loaded with every Tasklist form.
  2. These customisations are part of a particular BPM process user form but cannot be deployed with either of the usual deployment mechanisms (war or REST deployment).

I was hoping to find a mechanism which is specific to the form the directives are used in, and which can be deployed with the forms.

Are people not really using the Tasklist and embedded forms? I would think that these limitations would make extensive production use of embedded form impractical?

Thanks again, Peter

2 Likes

I’ve attempted to do the same thing and yes it very much does make the use of embedded form impractical.