Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html ng-app="svgImageTest">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>
  <meta charset="utf-8">
  <title>SVG Image Test</title>
  <style>.controller { border: 1px solid blue; }</style>
</head>
<body>
  <div ng-controller="SvgImageCtrl" class="controller">
    <h1>Without empty xlink-href</h1>
    <svg width="383" height="108">
      <image ng-href="{{ href }}" width="383" height="108" />
    </svg>
    <p>{{ href }}</p>
  </div>
  <div ng-controller="SvgImageCtrl" class="controller">
    <h1>With empty xlink-href</h1>
    <svg width="383" height="108">
      <image ng-href="{{ href }}" xlink:href="" width="383" height="108" />
    </svg>
    <p>{{ href }}</p>
  </div>
</body>
</html>
 
angular.module('svgImageTest', [])
  .controller('SvgImageCtrl', function ($scope) {
    $scope.href = 'http://angularjs.org/img/AngularJS-large.png';
  });
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers