jsPlumb beforeDrop和ngToast消息没有立即显示

时间:2015-10-07 20:17:59

标签: javascript angularjs jsplumb ngtoast

我正在使用优秀的jsPlumb库创建节点接口的网站。

jsPlumb有一个事件'beforeDrop',在连接两个端点之间的连接之前触发,我想用它来检查条件,然后决定是否允许连接。

不允许连接,我想使用ngToast向用户显示消息。

这是我的'beforeDrop'功能

jsPlumb.bind('beforeDrop', function(info){

    // Check that they property types match
    var outNodeType = $('#'+info.sourceId).data( "ptype" );
    var inNodeType = $('#'+info.targetId).data( "ptype" );


    if(outNodeType !== inNodeType){

        showMessage('warning', '<strong>Error:</strong> unable to connect '+outNodeType+' to '+inNodeType)

        return false // false for not establishing new connection

    }

    return true; // true for establishing new connection

});

这是显示ngToast消息的函数:

function showMessage(messageType, message){
        ngToast.warning({
            class: messageType,
            content: message
        });
    }

问题是在我点击页面上的任何地方之前,ngToast消息才会出现。点击后,会显示消息,一切正常。

我不知道这是jsPlumb和angularjs的问题,还是我调用ngToast函数的问题。

我真的很感激有关如何解决此问题的任何建议。 TIA!

1 个答案:

答案 0 :(得分:0)

jsPlumb事件将被视为角度上下文之外的事件。好像你从角度代码之外调用角度代码。对于make sync angular,您需要在调用烤面包机消息方法后调用$scope.apply()。因此,只要您点击它就会显示吐司。