角度自定义指令JQuery动画不会移动元素

WABBIT0111

我有一个自定义的角度指令,因此当您单击该元素时它将向下移动:angular.module('plunker',[])

.controller('AnimateCtlr', function(){

})
.directive('clickToAnimate', function(){
  var linker = function(scope, element, attrs) {

        element.bind('click', function(){
        console.log('moving');
        console.log( $( this).text() );
        $(this).animate({top: '+=150'});
      });
    };

    return {
        restrict: 'AE',
        replace: false,
        scope: {
            direction : '@'
        },
        link: linker  
    };
});

所有console.log都可以检测到单击事件,但是问题是div根本没有移动。这里有什么问题?

Plunker在这里:http ://plnkr.co/edit/j1OMiZFrar71P742dY6W?p=preview

可溶解的

如果您将位置设置为绝对位置,则应该可以正常工作

JS:

angular.module('plunker', [])
.controller('AnimateCtlr', function(){

})
.directive('clickToAnimate', function(){
  var linker = function(scope, element, attrs) {

        element.bind('click', function(){
        console.log('moving');
        console.log( $( this).text() );

        $(this).css({position: 'absolute'}) // can be done right here! But belongs in your CSS really.

        $(this).animate({top: '+=150'}, 300, function(){
          console.log('complete')
        });
      });
    };

    return {
        restrict: 'AE',
        replace: false,
        scope: {
            direction : '@'
        },
        link: linker  
    };
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

角度自定义指令不会触发ng-click

来自分类Dev

测试自定义的角度指令是否显示/隐藏元素

来自分类Dev

角度自定义指令困境

来自分类Dev

CKEditor渲染角度自定义指令

来自分类Dev

角度自定义指令数据绑定

来自分类Dev

从角度指令返回自定义错误

来自分类Dev

ngAnimate-动画不会在重复的自定义指令上触发

来自分类Dev

具有隔离范围的角度自定义指令不会触发ng-click函数

来自分类Dev

格式后不会清除文件名。$ setPristine用于文件上传的自定义角度指令

来自分类Dev

自定义元素指令和属性

来自分类Dev

使用$ compile从自定义指令操纵角度指令

来自分类Dev

角度小叶自定义标记(使用角度指令)

来自分类Dev

无法使用ngShow设置自定义指令的动画

来自分类Dev

自定义jquery / js滑块动画

来自分类Dev

自定义动画菜单CSS / jQuery

来自分类Dev

如何使用角度元素定义自定义元素方法

来自分类Dev

为term.js创建自定义的角度指令

来自分类Dev

不需要结束标记的自定义角度指令?

来自分类Dev

角度形式:在自定义指令上设置$ dirty属性

来自分类Dev

角度自定义指令调用内联函数

来自分类Dev

自定义指令在角度模块内不起作用?

来自分类Dev

自定义的角度指令以在间隔中添加/删除类

来自分类Dev

不需要结束标记的自定义角度指令?

来自分类Dev

具有自定义/条件操作的角度指令

来自分类Dev

为term.js创建自定义的角度指令

来自分类Dev

如何使用自定义的角度指令加载脚本?

来自分类Dev

有角度的。内含ng-repeat的自定义指令

来自分类Dev

Datepicker的角度自定义指令,弹出问题

来自分类Dev

如何从角度控制器调用自定义指令

Related 相关文章

热门标签

归档