Dear Chris, Thank you for your valid reply.
Actually am using the dynamic directive inside a directive. While i using the $compile inside the directive the outcome will be a infinite loop. How can i fix this issue while i have loading a directive inside another directive. Thanks & Regards, Akshath kumar M Mob : +919567102617 baabte℠ System Technologies Pvt Ltd. An ISO 9001 : 2008 certified company Office: + 91495-2295550 | Mob : +919539906339 www.baabte.com <http://www.baabte.com%20/> | www.baabtra.com | www.massbaab.com <http://www.baabtra.com/> On Sun, Jan 4, 2015 at 10:08 PM, Chris Huston <[email protected]> wrote: > Below is a directive I use for dynamically loaded html with angular > content. I haven't used this inside another directive, but it might get you > going: > > <div dynamic="html_with_angular_here"></div> > > > App.directive('dynamic', function ($compile) { > return { > restrict: 'A', > replace: true, > scope: { dynamic: '=dynamic'}, > link: function postLink(scope, element, attrs) { > scope.$watch( 'dynamic' , function(html){ > element.html(html); > $compile(element.contents())(scope); > }); > } > }; > }); > > > On Sunday, January 4, 2015 1:16:41 AM UTC-5, Akshath Kumar wrote: >> >> Hi, >> >> Could any one please help me to sort out this issue. >> >> >> >> Thanks & Regards, >> >> >> >> Akshath kumar M >> >> Mob : +919567102617 >> >> >> >> >> >> baabte℠ System Technologies Pvt Ltd. >> >> An ISO 9001 : 2008 certified company >> >> Office: + 91495-2295550 | Mob : +919539906339 >> >> www.baabte.com <http://www.baabte.com%20/> | www.baabtra.com | >> www.massbaab.com <http://www.baabtra.com/> >> >> On Sat, Jan 3, 2015 at 11:26 AM, Akshath Kumar <[email protected]> wrote: >> >>> Hi, >>> >>> I Have one scenario where i am adding directives dynamically from >>> another directive of an html element.The problem is that the dynamically >>> loaded directive couldn't get compiled. >>> >>> 1.my html element look like, >>> >>> <div class="form-control contentEditDiv" fg-custom-attributes >>> fg-field-input="" fg-placeholder="field.schema.placeholder" >>> ng-model="form.data[field.schema.name]" title="{{ field.schema.tooltip >>> }}" tabindex="{{ tabIndex }}" ng-required="field.schema.validation.required" >>> ng-minlength="{{ field.schema.validation.minlength }}" ng-maxlength="{{ >>> field.schema.validation.maxlength }}" ng-pattern="{{ >>> field.schema.validation.pattern }}"></div></div>'); >>> >>> 2. directive code to add dynamic directives, >>> >>> fg.directive('fgCustomAttributes', function($compile) { >>> /* >>> This Directive which will add custom attributes at the time of >>> rendering the template. >>> */ >>> >>> return { >>> scope:true, >>> link: function($scope, $element, $attrs) { >>> if($scope.form.schema.fields.length>0){ >>> for(var n=0;n<$scope.form.schema.fields.length;n++){ >>> if($scope.form.schema.fields[n].customlist!== undefined){ >>> optionsOfDirective= $scope.form.schema.fields[n]. >>> customlist; >>> for (var i = 0; i < optionsOfDirective.length; i++) { >>> var text = optionsOfDirective[i].text; >>> var value = optionsOfDirective[i].value; >>> $element.attr(value, text); //adding directive >>> dynamically from an object >>> /* here the dynamically added directive >>> couldn't get compiled. */ >>> } >>> >>> } >>> } >>> } >>> >>> } >>> >>> }; >>> }); >>> >>> 3. At last the element look like, >>> >>> <div class="form-control contentEditDiv ng-scope ng-pristine ng-valid >>> ng-valid-required" fg-custom-attributes="" fg-field-input="" >>> fg-placeholder="field.schema.placeholder" ng-model="message" >>> title="Content to be posted" tabindex="auto" >>> ng-required="field.schema.validation.required" >>> ng-minlength="" ng-maxlength="" ng-pattern="/" contenteditable="true" >>> ng-class="{focused: hasFocus}" no-line-breaks="true" strip-br="false" >>> select-non-editabl="true" id="contentEditDiv" placeholder="Content goes >>> here"></div> >>> >>> here the yellow background text is indicating the newly added directives >>> but which are no getting compiled. >>> >>> Please help me to sort out this issue.. >>> >>> >>> Regards, >>> >>> Akshath >>> >>> -- >>> You received this message because you are subscribed to a topic in the >>> Google Groups "AngularJS" group. >>> To unsubscribe from this topic, visit https://groups.google.com/d/ >>> topic/angular/2fXeMtKbooM/unsubscribe. >>> To unsubscribe from this group and all its topics, send an email to >>> [email protected]. >>> To post to this group, send email to [email protected]. >>> Visit this group at http://groups.google.com/group/angular. >>> For more options, visit https://groups.google.com/d/optout. >>> >> >> -- > You received this message because you are subscribed to a topic in the > Google Groups "AngularJS" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/angular/2fXeMtKbooM/unsubscribe. > To unsubscribe from this group and all its topics, send an email to > [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
