¿Cómo puedo generar una etiqueta de secuencia de comandos que está almacenada como una cadena en mi alcance en una plantilla de AngularJS?

Question

Necesito usar un script incrustado en mis plantillas pero insertar dinámicamente una ruta a una imagen antes de que se ejecute el script.

Escribí una directiva para construir la ruta de la imagen como una variable de alcance, luego uso $interpolate para insertar esto en el <script> etiqueta.

La referencia ahora almacenada (como una cadena) en $scope.tag es el código que me gustaría que me inyectaran e interpretaran/ejecutaran como lo haría una etiqueta de script.

Sin embargo, en cambio, la etiqueta de secuencia de comandos se agrega como una cadena en mi plantilla y parece que no puedo determinar qué paso adicional necesitaría dar para generar la cadena de etiqueta de secuencia de comandos como una etiqueta de secuencia de comandos.

Aquí está la plantilla (denominada en la directiva como templateUrl):

<div>
  {{ tag }}
</div>

Directiva:

'use strict';

angular.module('App')
  .directive('sslLogo', function($location, $interpolate) {
    return {
      replace: false,
      restrict: 'AE',
      templateUrl: '/views/partials/ssl-logo.html',
      controller: function($scope, $element, $attrs) {
        // Outputs the full base url (http:// ... .com/ )
        var base_url = '';
            base_url += $location.protocol() + '://';
            base_url += $location.host();

            if ( $location.port() ) {
              base_url += ':' + $location.port();
            }

        // Add the path to the image asset.
        $scope.logo_url = base_url + "/images/static/comodo-wildcardssl.png";

        // Interpolate this path into the script tag and then store the script tag to be output to the template.
        $scope.tag = $interpolate('<script type="text/javascript">TrustLogo("{{ logo_url }}", "SCCC", "none");</script>', false, true)({ logo_url: $scope.logo_url });
      },
      link: function(scope, element, attrs) {}
    };
  });

Como referencia, en este punto el $scope.tag La variable contendrá una cadena de:

<script type="text/javascript">TrustLogo("http://localhost:9000/images/static/comodo-wildcardssl.png", "SCCC", "none");</script>

Answer 1

Parece que:

...
link: function(scope, element, attrs) {
  element.append( scope.tag );
}
...

funciona que utiliza jquery para agregar la etiqueta del script al elemento de la directiva.