How to change element dynamically?

Question

I can change element's attributes seamlessly like this:

<input name="{{ currentField.name }}" type="{{ currentField.properties.type }}" ... />

But, I need to change the element (input, textarea, select etc.) dynamically.

If I try to change element, AngularJS doest not rendering the element. Instead, showing HTML:

<{{ currentField.element }} name="{{ currentField.name }}" type="{{ currentField.properties.type }}" ... />

This is the example {{ currentField }} data:

{ element: 'textarea', name: 'address', properties: { type: 'text', } }

Where is the problem?

anoop · Accepted Answer · 2017-04-01 11:09:41Z

1

Use it like :

 <textarea ng-if="currentField.element == 'textarea'" name="{{ currentField.name }}" type="{{ currentField.properties.type }}" ... /> <input ng-if="currentField.element == 'input'" name="{{ currentField.name }}" type="{{ currentField.properties.type }}" ... />

answered Apr 1, 2017 at 11:09

anoop

3,8222 gold badges18 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Umut Çağdaş Coşkun Over a year ago

There are a lot of elements. Should I write this code again and again for each one?

anoop Over a year ago

if there lot, then then you could create a directive. here is similar question, and this demo , hope it helps

Collectives™ on Stack Overflow

How to change element dynamically?

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related