how dynamically create div without ng-repeat,angularjs?

Question

I need to generate 'div' dynamically without the help of ng-repeat and also different data in the scope.

<div attribute={{atrb}}>{{name}}</div> (<- dynamic div).

Controller

$scope.GenerateDiv = function()
{
$scope.name = "praveen";
$scope.atrb = "01";
}

What is the reason you don't want to use ng-repeat when it's clearly the best and simplest solution ? — Erazihel
– Erazihel, Commented Feb 29, 2016 at 12:38
you can create a directive, where you can pass data, and a template. In the template you can put the html — adib.mosharrof
– adib.mosharrof, Commented Feb 29, 2016 at 12:49

Community · Accepted Answer · 2017-05-23 11:45:18Z

3

You can use ng-if, or $compile

edited May 23, 2017 at 11:45

CommunityBot

11 silver badge

answered Feb 29, 2016 at 12:45

terafor

1,62622 silver badges29 bronze badges

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

Comments

Nattu Raju · Accepted Answer · 2016-02-29 12:50:56Z

2

You can do it like

$scope.str = ''
for ( i = 0 ; i < arrayofdata ; i++ ){
  $scope.str += "<div>"+arrayofdata[0].ex+"</div>"
}


use Sanitize filter the following link contains log
https://docs.angularjs.org/api/ngSanitize

then create html like this
<div>
{{str | Sanitize}}
</div>

answered Feb 29, 2016 at 12:50

Nattu Raju

3101 gold badge3 silver badges11 bronze badges

Comments

Duncan · Accepted Answer · 2016-02-29 13:35:01Z

1

If it is a single div you use ng-if to control the creation of it:

<div attribute="{{atrb}}" ng-if="name">{{name}}</div>

When the condition is not met the div is not created. When the condition becomes true, the div will be added to your DOM.

If you need several of them then store the parameters in an array and use ng-repeat.

edited Feb 29, 2016 at 13:35

answered Feb 29, 2016 at 13:16

Duncan

96.4k15 gold badges129 silver badges160 bronze badges

2 Comments

Pravee Over a year ago

it is not single,i need to generate multiple div

Duncan Over a year ago

that's what ng-repeat is for.

Collectives™ on Stack Overflow

how dynamically create div without ng-repeat,angularjs?

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related