Using directives with ngSanitize in AngularJS

Question

In my app I have a really simple controller whose job is to display messages:

angular.module("app.components.messages", ['ngSanitize'])

.controller("MessageBoxController", ['$scope', function($scope)
{
    $scope.messageType = 'info';
    $scope.hidden = true;

    $scope.$on('message.error', function(event, message)
    {
        $scope.message = message;
        $scope.messageType = 'error';
        $scope.hidden = false;
    });

    $scope.$on('message.warning', function(event, message)
    {
        $scope.message = message;
        $scope.messageType = 'warning';
        $scope.hidden = false;
    });
}]);

Then the message box itself is pretty straight forward:

<div id="message-box" ng-controller="MessageBoxController"></div>

I'm using ngSanitize because sometimes I want to put links in the messages. For example in another controller I may do:

$rootScope.$broadcast('message.warning', 'You are about to download ' + file.name + ' which is ' + file.size + '. Your current quota is ' + user.quotaRemaining + ' click <a href="' + url + '">here</a> to confirm.');

And this works, and displays the link and everything. However in this particular case, after the user has clicked the link, I would like it to then fire another function to update the user's quota information. I naively tried putting an ng-click on my tag, but it turns out that ngSanitize filters out certain attributes, so that didn't work.

How can I get stuff to happen after the link in the message is clicked? I don't necessarily have to use ngSanitize, I just used it because it seemed convenient.

score 0 · Answer 1 · edited May 23 '17 at 11:54

0

Here solved similar problem. Just rename directive and pass to the directive you message. For example:

<div message="message"></div>

edited May 23 '17 at 11:54

Community

1
1

answered Dec 04 '14 at 08:25

Mikalai

1,515
8
21

This almost works. The ng-click part is no longer getting removed, however when I click the link, the function is not getting called. No error messages in the console or anything :\ – Cameron Ball Dec 04 '14 at 08:50
OK the issue was to do with scope. When I broadcast the message it's done from the rootScope, so ng-click links up to that. Changing my ng-click function from $scope.myFunc= to $rootScope.myFunc= seems to have worked. – Cameron Ball Dec 04 '14 at 09:02
some updates [here](http://jsfiddle.net/NWZZE/105/). Set scope to false in directive. – Mikalai Dec 04 '14 at 09:07

Using directives with ngSanitize in AngularJS

1 Answers1