问题
I'm trying to make a magazine using turn.js and angular.js
I'm using angular to parse the json file and extract the image path for using it in a $scope variable in my view with ng-repeat and the turn.js to make the flipbook animation to make the div look like a magazine.
But it doesnt generate the flipbook and just draw the images one after other.
Please help! I put the code right here
HTML
<div id="flipbook" class="flipbook"ng-repeat="slide in slides">
<div><img src="{{slide.path_main}}"></div>
</div>
</div>
Flipbook init
$("#flipbook").turn({
width: 1724,
height: 772,
autoCenter: true
});
回答1:
I don't believe there is a renderComplete
event or anything like that in angular; you may have to use $timeout
as suggested here.
// i'm taking assumptions with your code, but...
$scope.slides = [];
$http.get('/data/slides.json').success(function(data){
$scope.slides = data;
$timeout(function(){
$("#flipbook").turn({
width: 1724,
height: 772,
autoCenter: true
});
}, 0);
});
回答2:
I figure it out by adding the ngrepeat in the inner div of the flipbok! It was such a silly thing but now I have my flipbook perfct!
来源:https://stackoverflow.com/questions/28752950/can-i-work-with-angular-js-ng-repeat-and-turn-js