我正在创建一个简单的网站,其中有相机幻灯片 jquery 插件来显示图像。
现在,当我运行主页而不进行部分 View 时,它运行完美,但是当我使用路由并将此插件放在部分 View 中时,它不起作用?
这是我的 app.js 代码:
angular.module('sliderApp', [
'sliderController',
'ngRoute'
])
.config(["$routeProvider", function($routeProvider) {
$routeProvider.
when("/",{templateUrl: "partials/home.html", controller: "myController"}).
otherwise({redirectTo: "/"});
}]);
这是controller.js代码:
angular.module('sliderController',[])
.controller('myController', function($scope) {
$scope.images = [
{
bigimage : 'camera/images/slides/bridge.jpg',
thumb : 'camera/images/slides/thumbs/bridge.jpg'
},
{
bigimage : 'camera/images/slides/leaf.jpg',
thumb : 'camera/images/slides/thumbs/leaf.jpg'
},
{
bigimage : 'camera/images/slides/road.jpg',
thumb : 'camera/images/slides/thumbs/road.jpg'
},
{
bigimage : 'camera/images/slides/sea.jpg',
thumb : 'camera/images/slides/thumbs/sea.jpg'
}
];
});
有人可以告诉我它是如何工作的吗? 提前致谢。
最佳答案
花了一周时间,我找到了解决方案。为了克服这个问题,我制定了一个指令
.directive('camSlider', function($timeout) {
return function(scope, el, attrs) {
$timeout((function() {
el.camera({
thumbnails: true
})
}), 100)
}
})
并为元素指定了directive属性
<div class="camera_wrap camera_azure_skin" id="camera_wrap_1" ng-controller="myController" cam-slider>
<div ng-repeat="slide in slides" data-thumb="{{slide.thumb}}" data-src="{{slide.bigimage}}"></div>
</div>
现在它就像一个魅力:)
关于jquery - Angular js : camera slideshow jquery plugin is not working in partial view,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26845011/