AngularJS enlace de datos en ng-bind-html?

Question

¿Es posible vincular los datos de la variable de alcance a un html que está a punto de unirse como ng-bind-html?

es decir, tengo un

html ="<div>{{caption}}</div>";

y mi plantilla angular parece,

<div ng-bind-html="html"></div>

el valor del caption variable de alcance se establece en el controlador angular.

Por lo tanto, quiero enlazar datos en {{caption}} .

Gracias por adelantado..

Answer 1

¿Qué pasa?

html = ''<div ng-bind="caption"></div>'';

Answer 2

Debe compilar su fragmento de código HTML, pero se recomienda hacerlo dentro de la directiva.

app.controller(''MyCtrl'', function($compile){
  $scope.caption = ''My Caption'';
  $scope.html = $compile(''<div>{{caption}}</div>'')($scope);
});

<div ng-bind-html="html"></div>

Answer 3

Debe usar $ interpolar no compilar $.
Escribe el controlador de esta manera:

angular.module(''app'', [''ngSanitize''])
  .controller(''MyCtrl'', [''$scope'', ''$interpolate'', function($scope, $interpolate){
   $scope.caption = ''My Caption'';
   $scope.html = $interpolate(''<div>{{caption}}</div>'')($scope);
});

Luego escribe HTML como este:

<div ng-controller="MyCtrl">
    <div ng-bind-html="html"></div>
</div>