CODEWITHSUNDEEP
angularjsangularjs-directive
uday s
uday s

Reputation: 291

How to give name for custom directive in angularjs

Now i'm using camelcase directive name, like below

<code-input:text></code-input:text> (or)
<code-input-text></code-text-input>

can i use custom directice name and attribute like this,

<code-input:text dirType="text" labelHead="Code" dirName="Code" dirId="code" dirClass="form-control" dirModel="taskCreateForm.code" section-class="col col-3 required"></code-input:text>

if i give like this means , then doesn't render template from directive.because of, i have set every attribute for this is dynamically. 

scope : {
            dirName : '@',
            dirType : '@',
            dirModel : '=',
            labelHead : '@',
            sectionClass : '@',
        },
template : [
                   '<section class="{{sectionClass}}">',
                   '<label class="label">{{labelHead}}</label>',
                   '<label class="input">',
                   '<input type="{{dirType}}" name="{{dirName}}" id="{{dirId}}" class="{{dirClass}}" ng-model="dirModel">',
                   '</label>',
                   '</section>'
                   ].join(''),

can anyone give me guidance..is't possible or any issue has occurred because of this.else it's not standard way?

Upvotes: 0

Views: 127

Answers (2)

Arun
Arun

Reputation: 1185

If you created custom directive like

<codeInputText></codeInputText>

You have to use

<code-input-text></code-text-input>

it is better understanding of directive.

Upvotes: 0

sp00m
sp00m

Reputation: 48837

From https://docs.angularjs.org/guide/directive#normalization:

The normalization process is as follows:

  1. Strip x- and data- from the front of the element/attributes.
  2. Convert the :, -, or _-delimited name to camelCase.

That is to say, code-input-text and codeInputText are equivalent and match the codeInputText directive.

Upvotes: 1

Related Questions