Как применить плагин jQuery на angularjs?

Question

[Сергей]

Подскажите, как применить плагин jQuery на angularjs?
Код директивы:

app.directive('ibaModel', function () {
    return {
        restrict: 'A',
        priority: 1010,
        link: function (scope, element, attrs) {
            // debugger;
            var el = $(element);
            el.attr('id', scope.config.templateId);
            
            el.iba_model('init', {id: scope.config.templateId});
        }
    };
});

так не работает. Внутри плагина происходят запросы к серверу за скиптами и разметкой.

Плагин успешно выводит код но не применяет события.

Answer 1

[Борис Беньковский]

1. Использовать jquery и angular не есть лучшая идея, у них абсолютно разные идеологии. Но если "Вам надо и все тут", то
2. Про события, которые произошли "вне ангулар мира" ангулар ничего не знает. Ваш

el.iba_model('init', {id: scope.config.templateId});

явно что-то добовляет в DOM и чтобы ангулар об этом узнал Вам нужно в этот момент вызвать $digest ( или более безопасную функцию $apply)
Вот пример не моего jsfiddle jsfiddle.net/tnq86/15
После того, как элементы изменились в DOM из коллбека jquery вызывается $scope.$digest()

Comments

[Сергей]

Благодарю за ответ. Попробую. Отпишусь.

[Сергей]

Возможно что то не так делаю. Можешь пояснить?
>> Но если "Вам надо и все тут" - спасибо за понимание

в шаблоне

в контроллере
$scope.initSimulator = function() {
$(function () {
// debugger;
// wait till load event fires so all resources are available
$('#simulator').attr('id', $scope.config.templateId);
$scope.simulator = $('#simulator').iba_model('init', {
id: $scope.config.templateId
});
// debugger;
});
}

$.when(window.simulatorDef).then(function(){
debugger;
$scope.initSimulator();
});

и директива

app.directive('ibaModel', function () {
return {
restrict: 'A',
priority: 1010,
link: function (scope, element, attrs) {
var el = $(element);
el.attr('id', scope.config.templateId);
el.iba_model('init', {id: scope.config.templateId});
scope.$digest();
}
};
});

где я не прав ?

Answer 2

[Сергей Мишин]

У Вас не объявлен локальный scope

app.directive('ibaModel', function () {
    return {
        restrict: 'A',
        priority: 1010,
        scope: {
            config:{
                   templateId:'='
            }
       },
        link: function (scope, element, attrs) {
            // debugger;
            var el = $(element);
            el.attr('id', scope.config.templateId);
            
            el.iba_model('init', {id: scope.config.templateId});
        }
    };
});

Comments

[Борис Беньковский]

Если не прописан локальный скоуп, то будет использоваться скоуп родителя так, как будто он локальный