AngularJS data bind in ng-bind-html?
You should use $interpolate not $compile.
Write controller like this:
angular.module('app', ['ngSanitize'])
.controller('MyCtrl', ['$scope', '$interpolate', function($scope, $interpolate){
$scope.caption = 'My Caption';
$scope.html = $interpolate('<div>{{caption}}</div>')($scope);
});
Then write HTML like this:
<div ng-controller="MyCtrl">
<div ng-bind-html="html"></div>
</div>
You need to compile your HTML snippet, but it is recommended to do that inside the directive.
app.controller('MyCtrl', function($compile){
$scope.caption = 'My Caption';
$scope.html = $compile('<div>{{caption}}</div>')($scope);
});
<div ng-bind-html="html"></div>