How to print html in angular

1

Ok friends, I'm using angular and jquery.

I'm running a ng-repeat .

<div class="col-sm-6 col-md-4 col-lg-3" ng-repeat="hab in habilities">
    <div class="card custom">
        <div class="card-block">
            <h4 class="card-title">{{hab.name}}</h4>
            {{hab.calification | toHabilitiesStar}}
        </div>
    </div>
</div>

toHabilitiesStar is a directive that I created that returns a string in html; So far so good.

I researched and I came across with angualar sanitize , I've integrated it in the following way

angular.module('app', ['ngSanitize'])

But the console throws me this error [$injector:modulerr]

  • I already downloaded the file and integrated it into my head after angular.js and I already deleted the cache.
asked by Franklin'j Gil'z 25.02.2017 в 21:44
source

1 answer

1

Verify that the version of ngSanitize is correct. Use the following URL :

//ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-sanitize.js

Where X.Y.Z corresponds to the version of Angular.js that you are using. Here is an example that uses ngSanitize :

var app = angular.module("myApp", ["ngSanitize"]);

app.controller("customHTML", ["$scope", function ($scope) {

    $scope.html = "<div>Esto es un <strong>HTML</strong> devuelto desde un controlador</div>";

}]);
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-sanitize.js"></script>

<div ng-app="myApp">
    <div ng-controller="customHTML" ng-bind-html="html"></div>
</div>

Although the simplest thing is that you use the service $sce and thus avoid loading ngSanitize . Here is an example:

var app = angular.module("myApp", []);

app.controller("customHTML", ["$scope", "$sce", function ($scope, $sce) {

    $scope.html = $sce.trustAsHtml("<div>Esto es un <strong>HTML</strong> devuelto desde un controlador</div>");

}]);
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp">
  <div ng-controller="customHTML" ng-bind-html="html"></div>
</div>
    
answered by 26.02.2017 / 01:27
source