angularjs - Compile external HTML which is called by ajax in directive -
how compile external html file ?
i loading external html file via ajax based on browser request in directive there way compile file can used in directive?
corpo.directive('corpinbox', function(companyfactory, $templaterequest, $compile) { var directive = {}; directive.restrict = 'a'; directive.scope = { model: '=mgmodel' } directive.link = function($scope, element, attributes) { console.log("preparing inbox........"); var content = $('.inbox-content', element); var loading = $('.inbox-loading', element); var listlisting = ''; var loadinbox = function(el, name) { var url = 'templates/inbox/inbox_inbox.html'; var title = $('.inbox-nav > li.' + name + ' a', element).attr('data-title'); listlisting = name; loading.show(); content.html(''); togglebutton(el); $.ajax({ type: "get", cache: false, url: url, datatype: "html", success: function(res) { togglebutton(el); $('.inbox-nav > li.active', element).removeclass('active'); $('.inbox-nav > li.' + name, element).addclass('active'); $('.inbox-header > h1', element).text(title); loading.hide(); content.html(res); /*if (layout.fixcontentheight) { layout.fixcontentheight(); }*/ //metronic.inituniform(); }, error: function(xhr, ajaxoptions, thrownerror) { togglebutton(el); } }); // handle group checkbox: jquery('body').on('change', '.mail-group-checkbox', function() { var set = jquery('.mail-checkbox', element); var checked = jquery(this).is(":checked"); jquery(set).each(function() { $(this).attr("checked", checked); }); //jquery.uniform.update(set); }); } } return directive; });
first should using $http instead of $.ajax , compiling have inject $compile directive. , use below code inside success method of ajax call compile res.
var compiledhtml = $compile($(res))($scope); content.html(compiledhtml);
Comments
Post a Comment