Angularjs не загружает скрипты в ng-view

У меня были некоторые сценарии, специфичные для представления. Однако script, похоже, не выполняется, когда angularjs загружает представление.

Index.html

<html>
  <body ng-app="adminApp">

    <div ng-view=""></div>

    <script src="bower_components/angular/angular.js"></script>
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>

</body>
</html>

Main.html - загружается под ng-view

hello world
  <script>

    alert('Hello, John!')

  </script>

В этом примере, когда загружается страница, я вижу основной мир привет, напечатанный на веб-сайте. Тем не менее, я не получаю всплывающее сообщение "Привет, Джон".

Любая идея, почему я не могу загрузить сценарии, специфичные для определенного вида?

Дополнительная информация app.js

'use strict';

angular.module('adminApp', [])
  .config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  });

Контроллеры /main.js

'use strict';

angular.module('adminApp')
  .controller('MainCtrl', function ($scope) {
    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
  });

Ответ 1

Это способ jqLite. Если вы хотите, чтобы скрипты в шаблонах были оценены, включите jQuery перед AngularJS. Если включен jQuery, будет оценен script. Попробуйте удалить jQuery, и вы увидите первоначально обнаруженное поведение.

Обновлено: поскольку некоторые люди просили уточнить в комментариях, вот он:

Когда маршрут сопоставляется, ngView использует jqLite (или jQuery, если он загружен) html() метод для установки содержимого элемента (объявляется <<20 > ). Другими словами, ngView.link() делает что-то вроде этого:

$element.html(template)

Итак, это сводится к тому, как html() реализуется в jqLite и jQuery. jqLite использует родное свойство innerHTML, которое только устанавливает контент, но не оценивает скрипты. С другой стороны, jQuery анализирует все теги script и выполняет их (путем создания и добавления элементов DOM script на страницу).

Ответ 2

Если я включаю свой script, который должен работать с представлением, как я могу вызвать его при загрузке представления? Я не хочу включать jquery и/или фрагментировать мой script.

Чтобы выполнить тег <script> без загрузки jQuery, используйте jqLite, чтобы найти тег <script>, а затем eval innerHTML.

app.controller("vm", function($scope, $element) {

  //FIND script and eval 
  var js = $element.find("script")[0].innerHTML;
  eval(js);

});

DEMO на PLNKR

См. также Проблема с AngularJS # 369 - jqLite должен создавать элементы так же, как jQuery