Подскажите пожалуйста как заставить работать это?
<html ng-app="myApp">
<head>
<title><?=$page_title?></title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<style>
path:hover{stroke:red;fill:red;}
</style>
<script>
var app = angular.module('myApp', []);
app.factory('myMap', function($http) {
return {
getRegions: function() {
return $http.get('/map/paths')
.then(function(result) {
return result.data;
});
}
}
});
app.controller('Map', function($scope,myMap) {
$scope.paths = myMap.getRegions();
});
</script>
</head>
<body ng-controller="Map">
<svg ng-attr-height="1890" ng-attr-width="800">
<g transform="scale(5),translate(185,100)">
<path ng-repeat="region in paths" ng-attr-d="{{region.path}}" stroke="#060606" stroke-width="0.1" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill="rgb(176,176,176)" original="rgb(185,185,185)"></path>
</g>
</svg>
</body>
</html>
На выходе получается такой код:
<path ng-repeat="region in paths" ng-attr-d="M -55.472999999999999 34.622 L -55.374000000000002 34.802999999999997 -55.738 34.781999999999996 -56.039000000000001 34.884999999999998 -56.039000000000001 34.774999999999999 -56.363999999999997 34.734000000000002 -56.472000000000001 34.597000000000001 -56.363999999999997 34.362000000000002 -56.146000000000001 34.368000000000002 -55.999000000000002 34.244 -55.619 34.207999999999998 Z" stroke="#060606" stroke-width="0.1" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill="rgb(176,176,176)" original="rgb(185,185,185)"></path>
То есть значение подставляется а ng-attr-d не заменяется на аттрибут d.