Невозможно правильно загрузить внешний скрипт без jquery

Question

Я пытаюсь лениво загрузить директиву в другую директиву, основанную на условии. У меня есть основная директива, и внутри нее у меня есть тег <script>. Включенная директива правильно загружается только при наличии jquery, проблема в том, что не все мои страницы загружают jquery. Существует также второе предупреждение ...

синхронный XMLHttpRequest в основной теме устарел.

Который должен быть в состоянии подавить, если я нахожу чистый способ работы с скриптом.

Вот моя установка

<my-directive> 
    <script ng-if="expression" src="../path" type="application/javascript"></script> 
</my-directive> 

очень просто, но это работает только если JQuery есть, чтобы загрузить его. Я попытался загрузить его через запрос $http.get(), а затем eval() (который я знаю об опасности), но это не сработало.

Answer 1

Это способ, который использует подход $http. Вы можете создать директиву, которая добавляет ваш тег <script> для этой функции, проверяя определенный атрибут type. Конечно, вы могли бы изменить эту проверку, но хотите. Обратите внимание на следующее ...

app.directive('script', function($http) { 
    return { 
     restrict: 'E', 
     scope: false, 
     link: function(scope, elem, attrs) { 
      if (attrs.type === 'text/javascript-lazy') { 
       $http.get(attrs.src).then(function(response) { 
        var code = response.data; 
        var f = new Function(code); 
        f(); 
       }); 
      } 
     } 
    }; 
}); 

---

<!-- retrieved --> 
<script type="text/javascript-lazy" ng-if="true" src="script.js"></script> 
<!-- not retrieved --> 
<script type="text/javascript-lazy" ng-if="false" src="script.js"></script> 

Это будет работать внутри директивы элемента завернуты, а также.

---

Plunker - рабочая демо