Javascript AngularJS$animate.addClass（元素、类名、[options]）don´；t触发添加的css并返回回调错误

我正在尝试更改CSS值​​在我的动画中，AngularJS的官方文档通过addClasst详细介绍了这一点，没有外部JQuery插件。css转换运行，但不是在选项参数中传递的css。我还收到一个回调错误：

未捕获类型错误：对象不是函数 （匿名函数）

怎么了

控制器：

(function(){

var app = angular.module("VixMain", ['ngAnimate', 'vixParticles']);

app.controller("VixCtrl", ["$http", "$scope", "$document", "$animate", function($http, $scope, $document, $animate){

    var beggar = this;
    this.section = 0;

    beggar.backgrounds = [];

    this.bgContent = angular.element($document[0].querySelector(".bgContent"));

    this.changeSection = function(id){

        this.section = id;
        this.bgContent.removeClass("bgResize");
        $animate.addClass(this.bgContent, "bgResize", {from:{left:"10px"}, to:{left:"20px"}});
    }

    $http.get("/data/sections.json").success(function(data){

        beggar.sections = data;

        for(sec in beggar.sections){

            beggar.sections[sec].menu = data[sec].title.split(/(\.{3}|[^\w\s\.,\'])/g);
        }
    });


    }]);

CSS:

---

您可以将代码发布到jsfiddle.net吗？这里的问题是chaneSection函数内部的“this”引用，您需要将this赋值传递到changeSection函数外部的变量：var=this，然后使用该.bgContent。但是，您可以发布JSFIDLE，这样我就可以确定了。我尝试按您所说的那样放置变量，但收到了相同的结果，可能是因为queryselector返回一个数组，并且必须是单个元素。现在已经很晚了，我对代码做了一些修改，对不起，但是明天我第一次发布小提琴，谢谢你的回复；）我发布了这个JSFIDLE，上面有您在这里所说的更改。queryselector中的元素正确，仅获取数组的第一项

.bgResize.bgResize-add.bgResize-add-active{

opacity: 0;
}

.bgResize.bgResize-add{

-webkit-transition: all ease-in 1s;
transition: all ease-in 1s;

display:block!important;
opacity: 1;
}