Is there a way to compile the html template and also evaluate it right away?
For example:
angular.module('mainApp').directive('slider', ['$timeout', '$compile',
function ($timeout, $compile) {
var sliderTemplate =
'<ul class="bxslider">' +
'<li ng-repeat="item in items">' +
'<poster-info content="item"></poster-info>' +
'</li>' +
'</ul>';
return {
restrict: "E",
replace: true,
template: '<div id="{{sliderId}}-slider"><div
class="category-loading"></div></div>',
scope: {
items: '=',
sliderId: '='
},
link: function (scope, element, attrs) {
scope.$watch('items', function (newValue, oldValue) {
if (!newValue)
return;
var html = $compile(sliderTemplate)(scope);
var id = '#' + scope.sliderId + '-slider';
$(id).html(html);
$('ul', id).bxSlider({
infiniteLoop: false,
minSlides: 4,
maxSlides: 7,
moveSlides: 2,
slideWidth: 150,
pager: false,
isButtonOver: true,
useCSS: false
});
});
},
The "html" variable MUST be totally complete, that is, it needs to be
compiled and the items should already be loaded into the markup.
So far, when the line
var html = $compile(sliderTemplate)(scope);
is executed the <li> tags are not presented. How can I evaluate the items
before applying the bxSlider jquery library?
--
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.
