title: Parse an HTML document with AngularJS
body: <p>I'm attempting to write a simple drop-in hockey application in AngularJS. It will aggregate schedule data from local rinks and show it on a single page per metro area. However, some of the sites I'm aggregating from don't appear to support JSON, so I'm tasked with scraping HTML and then parsing it for time/date info. My question is: is there an idiomatic way to parse and display scraped HTML data in Angular? </p>
  
  <p>I bootstrapped the project with Yeoman + Bower. The controller for Denver-area drop-in looks like this:</p>
  
  <pre><code>angular.module('dropinApp')
    .controller('DenverCtrl', function ($scope, $http, $sanitize) {
  
     // Pull data from a pre-scraped html frame to get around CORS issues.
     /* http://denveruniv-web.ungerboeck.com/coe/coe_p1_all.aspx?oc=01&amp;cc=ICEDI30#mainContent */
     $http.get('/dropin_data/du-schedule.html').
        success(function(data, status, headers, config) {
          $scope.duHtmlData = data;
          $scope.duStatus = status;
        }).
        error(function(data, status, headers, config) {
          $scope.duData = data;
          $scope.duStatus = status;
        });
  
      // Yeoman/Bower stuff
      $scope.awesomeThings = [
        'HTML5 Boilerplate',
        'AngularJS',
        'Karma'
      ];
  
    });
  </code></pre>
  
  <p>I've tried several different ways to inject this into my Denver partial. This is the most recent:</p>
  
  <pre><code>&lt;!-- denver.html --&gt;
  &lt;p&gt;Denver Drop-In.&lt;/p&gt;
  
  &lt;p ng-bind-html="duHtmlData"&gt;{{ duHtmlData }}&lt;/p&gt;
  &lt;p&gt;status is {{ duStatus }}&lt;/p&gt;
  </code></pre>
  
  <p>This fails with:</p>
  
  <pre><code>Error: [$sanitize:badparse] The sanitizer was unable to parse the following block of html: &lt;!-- Body Listing ----------------&gt;...
  </code></pre>
  
  <p>I've also tried doing the parsing inside my controller: <code>$scope.duParsedData = $sanitize(duHtmlData)</code>  which generates roughly the same error. The HTML file is simply a curl dump from DU's website. </p>
  
  <p>Syntax issues aside, is this approach correct? Is there a more idiomatic way to scrape/parse third-party HTML in Angular?</p>