2

I have a JSON Service that will return JSON content, such as the following:

{
"page":"1",
"content":"<a href='#' ng-click='goToPage(135)'>Link to page 135</a>"
}

Now, what I do with that content is that I replace it in my page and that part is actually working.

What I have in my html page :

<div id="storyContent" ng-bind-html="content">

However, when the content is replaced, the events are not bound to my angularJS function. Here's my angularJS code:

var castleDeathApp = angular.module('castleDeathApp', ['ngRoute', 'ngSanitize']);

castleDeathApp.controller('PageCtrl', function ($scope, $http, $sce) {
    currentPage = localStorage.getItem('currentPage');

    $scope.title = 'Page '+currentPage;

    $http({
        url: "/Service/Page/1",
        method: "GET"
    }).success(function(data, status, headers, config) {
            $scope.content = $sce.trustAsHtml(data.content);
        });

    $scope.goToPage = function(pageNumber) {
        alert(pageNumber);
        localStorage.setItem('currentPage', pageNumber)

        $http({
            url: "/Service/Page/"+pageNumber,
            method: "GET"
        }).success(function(data, status, headers, config) {
                $scope.content = data.content;
        });
    }

});

I'm pretty sure I have to tell AngularJS that I wan't the arriving data (from the http call) to be bound to the controller.

Update 1:

I header using $compile, does someone know how this would integrate in my code ?

Etienne Noël
  • 5,988
  • 6
  • 48
  • 75

0 Answers0