unique form element names in directive template code

[lookfirst]

I have a need for unique names (and form validation) in my directive template. I'm starting to see a fairly ugly non-DRY pattern starting to emerge in my directives. It looks something like this (apologies for coffeescript, it's what I prefer):

    module = angular.module('foo', [])
    module.directive 'blah', ->
        restrict: 'E'
        replace: true
        scope: {}
        template: ->
            """
                <div ng-form="myForm">
                    <input type="text" dynamic-name="0" />
                    <input type="text" dynamic-name="1" />
                </div>
            """
    module.directive 'dynamicName', ->
        require: '^blah'
        controller: ($scope, $element, $attrs) ->
            unix = new Date().getTime()
            ELEMENT_NAMES = ["one#{unix}", "two#{unix}"]
            $attrs.$set('name', ELEMENT_NAMES[parseInt($attrs.dynamicName)])

I got the idea from @caitp 's excellent suggestion in issue #1404 . By doing it this way, it somehow causes things to register correctly with the formcontroller (I'm still relatively new to angular so all the pieces don't fit together well yet for me).

I'm filing this as a new issue because the other PRs (#4791, #5231) seemed to apply more towards interpolating the name attribute in a regular page template or within a repeat loop. Feel free to close if you think it is a duplicate.

I really wish there was a better way.

Update: I'm now running into this issue: http://docs.angularjs.org/error/$compile:multidir because I've tried to use dynamicName directive in multiple modules, but rendering on the same page and they are conflicting with each other. Making the directive more unique fixes the issue, but is also hacky. I thought that require: would cause things to get scoped better.

[lookfirst]

Arg. After struggling with this forever, I realized a great workaround. template: -> is a function. I'll just do a string replacement in there. Duh.

[kirkbushell]

In addition, I'd like to recommend and suggest you use javascript as the main language you use for examples. Not everyone uses coffeescript, and angular js isn't written in it.

[caitp]

@kirkbushell you're right about this, do you want to send a PR to translate the CS to JS?

[lookfirst]

@kirkbushell Thanks for the feedback Kirk. Someone should write a plugin for Github that allows you to switch between Coffee and JS in the comments (by filtering it through js2coffee.org).

[kirkbushell]

No worries - that's actually a really good idea. Is there docs somewhere on doing that? Writing plugins.etc. for that? And how would you then link that up to this?

[lookfirst]

I just emailed [email protected]. They usually log feature requests that way.

[lookfirst]

Hi Jon,

Thanks for your feedback! We're always working to improve GitHub and we consider every suggestion we receive. I've added your idea about switching between JavaScript and CoffeeScript to our internal Feature Request List.

We can't say if/when we may add a feature, however your feedback has definitely been recorded.

Cheers,
Steven!