当我将任何滑块或任何代码集成到我的项目代码中时 - 它不起作用。但是,它适用于Plunker。我只需要在/ Homeview中显示它。即使这段代码在index.html中运行良好。
这是 Homeview :
<div ng-controller="slideShowController" class="imageslide" ng-switch='slideshow' ng-animate="'animate'">
<div class="slider-content" ng-switch-when="1">
<img src="images/slider_1.jpg">
</div>
<div class="slider-content" ng-switch-when="2">
<img src="images/slider_1.jpg">
</div>
<div class="slider-content" ng-switch-when="3">
<img src="images/slider_1.jpg">
</div>
<div class="slider-content" ng-switch-when="4">
<img src="images/slider_1.jpg">dhakjsdhhasd
</div>
这是我的app.js
//Define an angular module for our app
var app = angular.module('blickbeeLite', [ 'ngRoute' ]);
app.controller('demoSwipeCtrl', function($scope) {
$scope.onSwipeLeft = function(ev) {
alert('You swiped left!!');
};
$scope.onSwipeRight = function(ev) {
alert('You swiped right!!');
};
$scope.onSwipeUp = function(ev) {
alert('You swiped up!!');
};
$scope.onSwipeDown = function(ev) {
alert('You swiped down!!');
};
});
app.controller('MainController', function($scope, $http)
{
});
app.config(['$provide', '$routeProvider', function ($provide, $routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/login.html',
})
.when('/:templateFile', {
templateUrl: function (param) { return 'views/'+param.templateFile+'.html' }
})
.otherwise({
redirectTo: '/'
});
}]);
#withinheader {
width:60%;
margin: 0 auto;
height: 100px;
}
.imageslide{
width:100%;
height:30%;
margin: 0 auto;
margin-bottom: 20px;
overflow:hidden;
position:relative;
text-align: center;
}
.imageslide .slider-content {
position: absolute;
width:100%;
height:30%;
}
.animate-enter,.animate-leave {
-webkit-transition:1000ms cubic-bezier(.165,.84,.44,1) all;
-moz-transition:1000ms cubic-bezier(.165,.84,.44,1) all;
-ms-transition:1000ms cubic-bezier(.165,.84,.44,1) all;
-o-transition:1000ms cubic-bezier(.165,.84,.44,1) all;
transition:1000ms cubic-bezier(.165,.84,.44,1) all;
}
.animate-enter {
left:100%;
}
.animate-enter.animate-enter-active {
left:0;
}
.animate-leave {
left:0;
}
.animate-leave.animate-leave-active {
left:-100%;
}
<script data-require="angular.js@1.1.5" data-semver="1.1.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
一切都很好,我没有到达我出错的地方。我尝试了很多次,但每次都失败了。有时,我还添加任何代码进行集成。问题总是欢迎我。
提前致谢。