I am creating a Windows Store application (or a metro application, or something else that they call) using the AngularJS function.
I solved the Javascript RunTime Error "Failed to add dynamic content" that crashed the application (see here ) and everything went fine until I started using the directive (undestand angular.module.directive).
Now I have "Unable to add dynamic content", but in the console log. Please note that the application does not crash, in fact the application works as expected!
Should I just ignore the error (I don't like it), can I do something about this?
The application code is "clock" to illustrate: The application displayed the correct time, was formatted and increased every second. DOM is what I expect.
Thanks,
index.html
<!doctype html> <html lang="en" ng-app="phonecat"> <head> <meta charset="utf-8"> <title>Google Phone Gallery</title> <link rel="stylesheet" href="css/app.css"> <link rel="stylesheet" href="css/bootstrap.css"> <script src="lib/jquery-1.8.2-win8-1.0.min.js"></script> <script type="text/javascript"> jQuery.isUnsafe = true; </script> <script src="lib/angular/angular.js"></script> <script src="js/app.js"></script> <script src="js/controllers.js"></script> <script src="js/filters.js"></script> <script src="js/services.js"></script> <script src="lib/angular/angular-resource.js"></script> </head>
app.js
angular.module('phonecat', ['phonecatFilters', 'phonecatServices']).config(['$routeProvider', function($routeProvider) { $routeProvider. when('/phones', {templateUrl: 'partials/phone-list.html',controller: PhoneListCtrl}). otherwise({redirectTo: '/phones'}); }]) .directive('myCurrentTime', function($timeout, dateFilter) { return { restrict: 'E', replace: true, template: '<div> Current time is: <span>{{time}}</span></div>', link: function (scope, element, attrs) { var timeoutId; function updateTime() { scope.time = dateFilter(new Date(), 'M/d/yy h:mm:ss a'); } function updateLater() { timeoutId = $timeout(function () { updateTime(); updateLater(); }, 1000); } element.bind('$destroy', function () { $timeout.cancel(timeoutId); }); updateLater(); } } });
Error:
HTML1701: Unable to add dynamic content '<my-current-time></my-current-time> '. A script attempted to inject dynamic content or elements previously modified dynamically that might be unsafe. For example, using the innerHTML property to add script or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content or explicitly create elements and attributes with a method such as createElement. For more information, see http: