Hi, I want to build an app which only works with Json Config File.
So, I want to create some button with specific link, but in HTML, not in javascript. (I create element in JS but I print the outerHTML)
But when I put personnal link, the sanitizer (or I don’t know) reset my link, look at code :
My state :
.state('menu.samplesToOrder', {
url: '/samplesToOrder/{config}',
views: {
'side-menu21': {
templateUrl: 'templates/samplesToOrder.html',
controller: 'samplesToOrderCtrl'
}
}
})
My link generator in my button : (item is the json config parsed)
button.setAttribute("href", "#/side-menu/" + item.module + "/" + item.config + "/");
button.setAttribute("ui-sref", "menu." + item.module + "()");
My HTML View :
<div compile="content" class="htmlComment"></div>
My Compile Directive (from SOF) :
.directive('compile', ['$compile', function ($compile) {
return function(scope, element, attrs) {
scope.$watch(
function(scope) {
// watch the 'compile' expression for changes
return scope.$eval(attrs.compile);
},
function(value) {
// when the 'compile' expression changes
// assign it into the current DOM
element.html(value);
// compile the new DOM and link it to the current
// scope.
// NOTE: we only compile .childNodes so that
// we don't get into infinite loop compiling ourselves
$compile(element.contents())(scope);
}
);
};
}])
My Controller (HTML Injection) :
.controller('homeCtrl', ['$scope', '$stateParams', '$sce', 'configFactory',
function ($scope, $stateParams, $sce, configFactory) {
configFactory.getConfig("default")
.then(function (response) {
debugger;
var config = response.data;
var html = createView(config);
$scope.content = $sce.trustAsHtml(html);
});
}])
I want to create link like href="#/side-menu/samplesToOrder/ConfigFileName"
but always my HTML delete my href and replace it by href="#/side-menu/samplesToOrder/"
Can you help me ? thank you.
I also tried that (disable sanitization and enable whitelist URL) :