角动画使用元件insde视点的视点的父DIV(Angular animate parent div

是否有可能CSS动画一个div（背景色），这是NG-视图外，采用了指令在$状态NG视图里面？

在NG-观点对路由CSS动画。

如果我不动画DIV那么NG-视图anims做工精细，但..如果我添加动画类到div（bgId），那么路由anims不火。

这里是HTML样本：（按钮加入如实施例 - 通常是在模板的页面例如home.html做为/ login.html的）。

<body ng-app="app" ng-controller="MainCtrl"> 
    <div id="bgId" class="{{colorVal}}">
        <ion-nav-view animation="slide-left-right">
        </ion-nav-view>
    </div>
    <button swapcolour="changeColour()" data-nxtpage="1">change colour</button>
</body>

这是由指令（swapcolour）控制，但未通过按钮ATTR的nxtpage值和更新MainCtrl的colorVal。

//MainCtrl.js

.controller('MainCtrl', ['$scope', '$state', function($scope, $state) {
    $scope.colorVal = 'redBg';
}])

//Directive.js

.directive('swapcolour', function ($rootScope, $state) {
    var pageArr = [{home:'redBg'},{login:'blueBg'}];

    return function (scope, element, attrs) {        

        var nextPageNum = attrs.nxtpage;           
        var obj = pageArr[nextPageNum];
        var item = Object.keys(obj);
        var objItem = obj[item];

        element.bind('click', function () {
            $state.transitionTo(item[0]);      
            $rootScope.$$childHead.colorVal = objItem;
        });
    }
}])

我不知道它为什么失败。有任何想法吗？？我是新来的指令。（试图建立一个plunker，但有越来越离子的工作与它的问题）

我修好了它！ - 我认为。之后基本上完全剥离应用到它的骨头我设法建立一个plunker并得到它的工作。

没有什么错我的代码毕竟。

<body ng-app="app" ng-controller="MainCtrl"> 
    <div id="bgId" class="{{colorVal}}">
        <ion-nav-view animation="slide-left-right">
        </ion-nav-view>
    </div>
</body>

http://plnkr.co/edit/Oug8zD?p=preview

然后我试图在我的应用程序的代码 - 它仍然没有工作！所以，我想更换我ionic.bundle.js和ionic.css文件（使用NPM安装原稿）与在plunker（1.0.0-RC.1）所使用的文件和我的应用程序的工作:)

希望这可以帮助其他人在未来的麻烦。