2015-10-07 3 views
1

Я работаю над сайтом, который использует большую библиотеку jsPlumb для создания интерфейса узла.jsPlumb beforeDrop и ngToast сообщение не отображается мгновенно

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.

Я был бы очень признателен за любые предложения относительно того, как это разрешить. ТИА!

+0

Попробуйте запустить цикл дайджеста .. как только вы вызываете метод showMessage .., вы вызываете угловой код из-за углового контекста .. –

+0

Спасибо @Pankaj Я добавил $ scope. $ Apply() перед 'return false ", и все это отлично работало! –

+0

Проверьте .. Я добавил ответ –

ответ

0

Событие jsPlumb будет рассматриваться как событие вне углового контекста. Похоже, вы вызываете угловой код вне углового кода. Чтобы сделать синхронизацию синхронизации, вам необходимо позвонить $scope.apply() после вызова метода сообщения тостера. Так что тост будет показан, как только вы нажмете на него.