angular.js: $sanitize fails on $injector:modulerr using exact code example from angular site

angularjs, javascript

Solution

There error was self explanatory, you didn't include the angualar.sanitize.js script in the fiddle or plunkr.

I added the below script tag below

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-sanitize.js"></script>

FIDDLE

Problem

UPDATE: steps to reproduce: visit this link :http://docs.angularjs.org/api/ngSanitize.$sanitize click on 'EDIT' button top right of code sample. select jsfiddle or plnkr expected result: will see the html output under the 'rendered' heading I am trying to implement html binding. Curiously, I can't get a working example using the exact code from this example: http://docs.angularjs.org/api/ngSanitize.$sanitize It works on angular site, but not elsewhere. I have tried using the edit link to plunk and jsfiddle, with no results. Running locally I get this error in console: here is what I get in console: Uncaught Error: [$injector:modulerr] HTML: ``` <!doctype html> <html ng-app="ngSanitize"> <head> <script src="http://code.angularjs.org/1.2.10/angular.min.js"></script> <script src="script.js"></script> </head> <body> <div ng-controller="Ctrl"> Snippet: <textarea ng-model="snippet" cols="60" rows="3"></textarea> <table> <tr> <td>Directive</td> <td>How</td> <td>Source</td> <td>Rendered</td> </tr> <tr id="bind-html-with-sanitize"> <td>ng-bind-html</td> <td>Automatically uses $sanitize</td> <td><pre>&lt;div ng-bind-html="snippet"&gt;<br/>&lt;/div&gt;</pre></td> <td><div ng-bind-html="snippet"></div></td> </tr> <tr id="bind-html-with-trust"> <td>ng-bind-html</td> <td>Bypass $sanitize by explicitly trusting the dangerous value</td> <td> <pre>&lt;div ng-bind-html="deliberatelyTrustDangerousSnippet()"&gt; t;/div&gt;</pre> </td> <td><div ng-bind-html="deliberatelyTrustDangerousSnippet()"></div></td> </tr> <tr id="bind-default"> <td>ng-bind</td> <td>Automatically escapes</td> <td><pre>&lt;div ng-bind="snippet"&gt;<br/>&lt;/div&gt;</pre></td> <td><div ng-bind="snippet"></div></td> </tr> </table> </div> </body> </html> ``` JS: ``` function Ctrl($scope, $sce) { $scope.snippet = '<p style="color:blue">an html\n' + '<em onmouseover="this.textContent=\'PWN3D!\'">click here</em>\n' + 'snippet</p>'; $scope.deliberatelyTrustDangerousSnippet = function() { return $sce.trustAsHtml($scope.snippet); }; } ```

Original source