0

私はルートを使用していng-viewて、ページの本文にあります：

<!doctype html>
<html ng-app="app">
  <head>
  ...
  </head>
  <body>
    <div ng-view></div>
  </body>
</html>

私のテンプレートには<link>要素が含まれています：

<link rel="stylesheet" type="text/css" href="style.css">

<link>問題は、IE8が体内の要素を認識しないことです。同様に<style>そして多分他の人。それらを無視しているようです。彼らはにいる必要があり<head>ます。したがって、テンプレートを分割する必要があります。<head>一方をに、もう一方をに移動する必要があり<body>ます。

これを回避する方法は？

4

1 に答える 1

1

テンプレートを取得してリンクをAngularServiceに登録し、ヘッドタグにリンクのリストを作成するコントローラーを含めることができます。

次に例を示します：http：//plnkr.co/edit/1a6U9f

app.factory('LinkService', function() {
  var links = {};
  return {
    links: links,
    addLink: function(href, relation) {
      links[href] = { href: href, relation: relation };
    },
    removeLink: function(href) {
      delete links[href];
    }
  };
});

app.controller('LinkController', function($scope, LinkService) {
  $scope.links = LinkService.links;
});

app.controller('Template1Controller', function($scope, LinkService) {
  LinkService.addLink('template1.css','stylesheet');
  $scope.$on('$destroy', function() {
    LinkService.removeLink('template1.css');
  });
});

次に、HTMLで（デモ用のインラインパーシャル）：

<head ng-controller="LinkController">
  ...
  <link rel="{{link.relation}}" ng-href="{{link.href}}" ng-repeat="link in links">
</head>
<body ng-controller="MainCtrl">
  <!-- You could use ng-view here -->
  <ng-include src="someTemplateField"></ng-include>

  <script type="text/ng-template" id="template1">
    <div class="red" ng-controller="Template1Controller">Template 1</div>
  </script>

</body>
于 2012-11-05T09:37:38.750 に答える