我尝试在网站的前面使用Flexslider管理响应式滑块,但是当我使用 Angular.js 时,我的图像没有直接指定"src"属性,Angular 使用"ng-src"属性自行管理它。所以我的滑块工作(我可以看到导航控件),但是是空白的......
有什么方法可以解决吗?或者另一个响应式滑块库的想法,应该适用于 Angular.js ?
#templates/detail.html
<div class='flexslider'>
<ul class='slides'>
<li ng-repeat='slide in project.slides'><img ng-src='{{slide}}' alt='{{project.name}}' /></li>
</ul>
</div>
#js/app.js
'use strict';
angular.module('test', []).config([
'$routeProvider',
function ($routeProvider) {
$routeProvider
.when('/', { templateUrl: 'detail.html', controller: ProjectCtrl })
}
]);
#js/controllers.js
'use strict';
function ProjectCtrl($scope) {
$scope.project = {
id: 1,
name: 'Test',
slides: [
'test.png',
'test2.png'
]
};
$('.flexslider').flexslider();
};
事实上,这是由 Twig 渲染引擎引起的,用户也使用双括号:{{ }}
我通过使用树枝的原始过滤器渲染一些原始 HTML 来修复它:http://twig.sensiolabs.org/doc/filters/raw.html