CODEWITHSUNDEEP
javascripthtmlangularjs
maudulus
maudulus

Reputation: 11045

Add <object> with custom attributes using AngularJS controller

I'm attempting to add an <object></object>into my html using a controller. When I load a <div> or a <p>, it works properly, but when I add an <object> it doesn't appear, nor do any custom attributes.

HTML:

<html ng-app="myAngularSite">        
...
...
    <div ng-controller="MyController">
        <div id="myloader" ng-bind-html="myObject"></div>
    </div>

JS: 

var app = angular.module('myAngularSite', ['ngRoute']);

angular.module('myAngularSite', ['ngSanitize'])
        .controller('MyController', ['$scope',function($scope) {
            $scope.myObject = 
                '<object id="my_object" data="mysite.html" width="99.5%" height="400px" style="overflow:auto;border:3px ridge gray"/>';
        }]);

How can I add the custom attributes and the object into my site? I noticed that attributes won't appear when I try to load a <div id"with_attribut></div> with attributes, although the divs appear by themselves.

Thanks!

Upvotes: 0

Views: 76

Answers (1)

IMujagic
IMujagic

Reputation: 1259

The custom directive is probably the good solution, you can always add more custom behaviours. With ngBindHtml you will be limited. Here is link which can help you:

angular ng-bind-html and directive within it

Upvotes: 1

Related Questions