Unexpected value {{specs.height}} parsing height attribute. index.html
<p><strong>I am practicing responsive SVGs with angularjs</strong>
I try to draw a rectangular barchart using ng-repeat but only one displayed and the others keep springing out error.</p>

<p>Here is what I tried:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!doctype html&gt;
&lt;html&gt;

&lt;head&gt;
  &lt;title&gt;Angular Charts&lt;/title&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;!--&lt;script src="js/angular.min.js"&gt;&lt;/script&gt;--&gt;
  &lt;script src="https://code.angularjs.org/1.4.2/angular.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
    var dashboard = angular.module("Dashboard", []);

    dashboard.controller("BarGraphController", function($scope) {
      $scope.specs = {
        height: 30,
        bars: [{
          color: '#2a9fbc',
          width: 50
        }, {
          color: '#f15b2a',
          width: 70
        }, {
          color: '#a62e5c',
          width: 100
        }]
      };
    });
  &lt;/script&gt;
&lt;/head&gt;

&lt;body ng-app="Dashboard"&gt;
  &lt;div ng-controller="BarGraphController"&gt;
    &lt;span&gt;
                &lt;svg xmlns="http://www.w3.org/2000/svg" width="250" height="250" style="border:solid 1px gray"&gt;
                    &lt;rect ng-repeat="bar in specs.bars" 
                        x="0" y="0" fill="{{bar.color}}" width="{{bar.width}}" height="{{specs.height}}"/&gt;
                &lt;/svg&gt;
            &lt;/span&gt;
  &lt;/div&gt;
&lt;/body&gt;

&lt;/html&gt;</code></pre>
</div>
</div>
</p>

<p>here is what I keep getting in my browser:</p>

<blockquote>
  <p>Unexpected value {{specs.height}} parsing height attribute. index.html
  Unexpected value {{bar.width}} parsing width attribute. index.html
  Unexpected value {{specs.height}} parsing height attribute. angular.min.js:70:379
  Unexpected value {{bar.width}} parsing width attribute. angular.min.js:70:379
  Unexpected value {{specs.height}} parsing height attribute. angular.min.js:70:379
  Unexpected value {{bar.width}} parsing width attribute. angular.min.js:70:379
  Unexpected value {{specs.height}} parsing height attribute. angular.min.js:70:379
  Unexpected value {{bar.width}} parsing width attribute.</p>
</blockquote>