Tinymce不在angularjs mdDialog工作

时间:2017-06-27 11:24:37

标签: javascript html angularjs tinymce

我试图在angularjs mdDialog中使用TinyMCE编辑器 Worling Plukr:http://embed.plnkr.co/s3NsemdcDAtG7AoQRvLh/


有问题的Plunkr:http://embed.plnkr.co/fL8kGLl3b4TNdxW1AtKG/

所有功能都正常工作而不是下拉: http://prntscr.com/fop9u0
 如果我将下降的顶部位置增加到100px左右,它可以正常工作。 http://prntscr.com/fope8o
我注意到由于页面滚动而出现此问题..

有人可以帮助我把这些摔倒在合适的位置。

2 个答案:

答案 0 :(得分:3)

有一个顶级位置计算问题,可以修复在app.js文件中添加以下代码 `

$scope.addMoreInfoFunction = function(event) {
        setTimeout(function() {
            $('.mce-btn').on('click', function() {
                var bodyTop = $('body').offset().top;
                if (bodyTop < 0) {
                    setTimeout(function() {
                        var top = parseInt($('#mceu_50').css('top'));
                        var newTop = top / 2 - bodyTop - 30;
                        $('#mceu_50').css('top', newTop);
                        console.log(newTop);
                    }, 300);
                }
            });
        }, 300);
        $mdDialog.show({
            controller: ['$scope', '$mdDialog', DialogAddMoreInfoController],
            templateUrl: 'addMoreInfo.tmpl.html',
            parent: angular.element(document.body),
            targetEvent: event,
            clickOutsideToClose: true
        });
        };
        });

`

可以更正计算,了解是否有帮助

答案 1 :(得分:1)

CSS冲突可能是所有div的强制保证金。所以这更像是一个集成问题,而不是一个错误的bug。我们有一些重置规则来消除常见冲突。

   <style>
   .mce-tooltip
  {
    position: fixed !important;
  }
  .mce-panel.mce-floatpanel.mce-menu 
  {
    position: fixed !important;
  }
    </style>

它不能完美运作。但它可能会帮助你做点什么。