Я хотел добавить ng-click в компонент RTE, для которого у меня нет контроля над элементом RTE.

В моем компоненте AEM есть элемент rte. вся разметка генерируется динамически, и я хотел добавить ng-click для вызова функции. Вот код для добавления RTE${properties.text @context='html'} Это дает мне просто класс, который я использую в качестве селектора. Мой существующий код выглядит следующим образом:

var sdshopNowLink = angular.element('.sdshopNowLink');
sdshopNowLink.on('click', function(){
    $scope.submitshopeCatalog();
});

Сначала я использовал селекторы javascript, но это не работает в первый раз. Использование $compile работает локально, но не после минификации.

var sdshopNowLink = angular.element('.sdshopNowLink'); 
sdshopNowLink.attr("ng-click", "submitshopeCatalog()");
compile(sdshopNowLink);

function compile(element){
    var el = angular.element(element);    
    $scope = el.scope();
    $injector = el.injector();
    $injector.invoke(function($compile){
        $compile(el)($scope)
    });     
}

Также вышеизложенное имеет некоторые проблемы с производительностью. Есть ли другой способ добавить ng-click и вызвать функцию.


javascript angularjs aem rte
person Sourav Tomar    schedule 20.03.2019    source источник
comment
Вы можете прикрепить обработчик событий к родительскому элементу, которым вы управляете, и делегировать этот обработчик динамическому элементу.   -  person Sandeep Saroha    schedule 20.03.2019
comment
Возможный дубликат Вызов функции angularjs с использованием jquery/javascript   -  person ClydeFrog    schedule 20.03.2019
comment
@ClydeFrog Очень похоже, но ваше решение не будет добавлять ng-click, потому что я хочу, чтобы функция вызывалась только при нажатии.   -  person Sourav Tomar    schedule 20.03.2019
comment
Да, похоже. Хотя вы можете использовать ту же функциональность в приведенном примере для удовлетворения ваших потребностей.   -  person ClydeFrog    schedule 22.03.2019

Ответы (1)


arrow_upward
0
arrow_downward

Например, ответ на повторяющийся вопрос я указал в комментариях. Вы можете использовать это для удовлетворения своих потребностей. Как это:

HTML

<div id="YourElementId" ng-app='MyModule' ng-controller="MyController">
    Hi
</div>

JS-код

angular.module('MyModule', [])
    .controller('MyController', function ($scope) {
    $scope.myfunction = function (data) {
        alert("---" + data);

        // Do something more...
    };
});

// I changed the code here so when element with ID "YourElementId" 
// gets clicked, it executes the anonymous function that calls "myFunction" 
// in the controller "MyController"
window.onload = function () {
    angular.element(document.getElementById('YourElementId')).on('click', function (event) {
        angular.element(event.target).scope().myfunction('test');
    });
}
person ClydeFrog    schedule 22.03.2019