Question

我试图在我的网页上设置某些元素的动画，并且遇到了ngAnimate模块的问题。我为.ng-enter和.ng-enter-active：

设置了一些CSS类

＆＃13;

/*Animations*/
.fade.ng-enter {
	-webkit-transition: 1s linear all;
 	transition: 1s linear all;
 	opacity: 0;
}
.fade.ng-enter-active {
	opacity: 1;
}

＆＃13;

	<div class="container searchContent">
		<div class="panel fade" ng-repeat="object in objects">
			<h1>{{object.name}}</h1>
			{{object.description}}
		</div>
	</div>

＆＃13;

但这不起作用。如果＆＃34;褪色＆＃34;它不会起作用。也是一个id。但是，当我依赖HTML元素时，动画仍然可以工作：

＆＃13;

/*Animations*/
div.ng-enter {
	-webkit-transition: 1s linear all;
 	transition: 1s linear all;
 	opacity: 0;
}
div.ng-enter-active {
	opacity: 1;
}

＆＃13;

这使得所有div都淡入，但我希望能够使某些div消失。我在网上找到的所有资源都表明这是正确的方法，但它并不适合我，而且我在控制台中没有收到任何错误。

也许它与UI路由器或其他东西有关，但我真的难以理解为什么它会像这样表现。

我还会包含我认为与此问题相关的任何其他代码。告诉我你是否想要看到其他任何东西。感谢：

原始应用配置：

＆＃13;

var app = angular.module("app", [
	'ngRoute',
	'ngAnimate',
	'ui.router',
	'homeController',
	'searchController',
	'apidpController',
	'nLogin',
	'nSignUp',
	'nLogo',
	'flButton',
	'nSearch',
	'userRequest'
]);

app.config(["$stateProvider", "$urlRouterProvider", "$locationProvider", function($stateProvider, $urlRouterProvider, $locationProvider) {
	$urlRouterProvider.otherwise("/home");

	$stateProvider.
		state('presentation', {
			templateUrl: './app/presentation/presentation.tpl.html',
			url: '/'
		}).
		state('presentation.home', {
			templateUrl: './app/home/home.tpl.html',
			controller: 'homeController',
			url: 'home'
		}).
		state('presentation.search', {
			templateUrl: './app/search/search.tpl.html',
			controller: 'searchController',
			url: 'search'
		}).
		state('api', {
			templateUrl: './app/apidp/apidp.tpl.html',
			controller: 'apidpController',
			url: 'api'
		});
}]);

＆＃13;

我希望动画在presentation.search

中

Angular ngAnimate不会使用id和class

0 个答案: