title: AngularJS errors in IE8
body: <p>I am working with a new angular app and need to make it backward compatible to IE8. From what it looks like it loads in my routing info, loads the template (to a point) but in the concole log i see the following error. </p>
  
  <blockquote>
    <p>TypeError: Object doesn't support this property or method <code>&lt;div
    class=ng-scope ng-view&gt;</code></p>
  </blockquote>
  
  <p>This is what my index html page looks like:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html id="ng-app" ng-app="app"&gt;
      &lt;head&gt;
          &lt;!--Add dependencies--&gt;
          &lt;script src="jquery.min.js"&gt;&lt;/script&gt;
          &lt;link rel="stylesheet" src="bootstrap.min.css" /&gt;
          &lt;script src="angular.min.js"&gt;&lt;/script&gt;
          &lt;script src="angular-route.js"&gt;&lt;/script&gt;
          &lt;script src="ui-bootstrap.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
              document.createElement('header');
              document.createElement('nav');
              document.createElement('menu');
              document.createElement('section');
              document.createElement('article');
              document.createElement('aside');
              document.createElement('footer');
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="wrapper"&gt;
              &lt;header class="header header-fixed"&gt;
                  &lt;section class="navbar navbar-inverse docs-navbar-primary"&gt;
                      &lt;div class="container"&gt;
                          &lt;div class="row"&gt;
                              &lt;div class="col-md-7" style="color:white; margin-top:14px;"&gt;Thinflash: Fullscreen Demo&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/section&gt;
              &lt;/header&gt;
              &lt;section role="main" class="container main-body"&gt;
                  &lt;div ng-view&gt;&lt;/div&gt;
              &lt;/section&gt;
              &lt;!--Add AngularJs Files--&gt;
              &lt;script src="swfObject.js"&gt;&lt;/script&gt;
              &lt;script src="app.js"&gt;&lt;/script&gt;
              &lt;script src="appControllers.js"&gt;&lt;/script&gt;
              &lt;script src="thinflash.js"&gt;&lt;/script&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Template.html :</p>
  
  <pre><code>&lt;div ng-controller="thinflash.controllers.playback"&gt;
      &lt;div ng-controller="app.controllers.fullscreen"&gt;
          &lt;div class="mainWrapper" id="stageWrapper"&gt;
              &lt;label&gt;SWF Object Display &lt;/label&gt;
              &lt;div class="swfWrapper" style="width:320px; height:240px;" id="swfStage"&gt;
                  &lt;div class="tf-container" tf-swf tf-interface="flashInterface" tf-src="thin.swf" tf-min-version="11.0.0"&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="col-md-5"&gt;
               &lt;form role="form"&gt;
                   &lt;!-- Video Playback Controls --&gt;
                   &lt;div class="row"&gt;
                       &lt;div class="form-group col-md-7"&gt;
                           &lt;label&gt;Select Preloaded Video:&lt;/label&gt; 
                           &lt;select class="form-control" ng-model="myVideo" ng-init="myVideo = videos[2]" ng-change="changeVideo(myVideo)" ng-options="v for v in videos"&gt;&lt;option&gt;&lt;/option&gt;&lt;/select&gt;
                       &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div class="row"&gt;
                      &lt;div class="form-group col-md-7"&gt;
                          &lt;button type="button" class="btn btn-primary" ng-click="pausePlaybackToggle()"&gt;Pause&lt;/button&gt;
                          &lt;button type="button" class="btn btn-primary" ng-click="playVideo()"&gt;Play&lt;/button&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div class="row"&gt;
                      &lt;div class="form-group col-md-7"&gt;
                          &lt;label&gt;Volume Control:&lt;/label&gt; 
                          &lt;input style="width:50%;" type="range" id="slider" min="1" max="100" step="1" ng-model="volume" ng-change="changeVolume()"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div class="row"&gt;
                      &lt;div class="form-group col-md-8"&gt;
                          &lt;label&gt;Size Controls:&lt;/label&gt;&lt;br/&gt; 
                          &lt;button type="button" class="btn btn-primary" ng-click="changeVideoSize(1)"&gt;Small&lt;/button&gt;
                          &lt;button type="button" class="btn btn-primary" ng-click="changeVideoSize(2)"&gt;Medium&lt;/button&gt;
                          &lt;button type="button" class="btn btn-primary" ng-click="changeVideoSize(3)"&gt;Large&lt;/button&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/form&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Again when the app loads in IE8 it appears that the template loads (or starts too ... but i get this error) </p>