Filter file name with angularjs

I am getting from server side, data along with filename, the problem is, the filename is with extension for example 1125495.jpg or 533123.png, in my application I am trying to get the thumbnail for this image, which is stored in the server as 1125495-160x160.jpg and 533123-160x160.png

Is this I can do using filter or should I ask for modification in the server side ?

You can do like this 

var app = angular.module('starter', []);
app.filter('thumbnail', function() {
  return function(input) {
     var parts = input.split(".");
     var file = parts[0]+"-"+"160x160"+"."+parts[1];
     return file;

  };
});

app.controller('MainCtrl', function($scope, $filter) {
  $scope.files = [
      "1125495.jpg",
      "533123.png"
    ];
});

Check this codepen http://codepen.io/anon/pen/LExayW

yes you can use the angularjs $filter here

create a filter which accepts the images array, and a argument for thumbnail name, and iterate through the array and create the thumbnail name and return the thumbnail array

app.filter("fileNameFilter", function() {
  return function (input, thumbnail) {
    var thumbnailArray = [];
    angular.forEach(input , function(value, key) {
       var parts = value.split(".");
       var thumb_name = parts[0]+"-"+thumbnail+"."+parts[1];
       thumbnailArray .push(thumb_name);
    });
    return thumbnailArray ;
  }

});

in controller u can call the filter as,

app.controller('MainCtrl', function($scope, $filter) {
  $scope.files = [
    "1125495.jpg",
    "533123.png"
  ];

  $scope.filteredFiles = $filter('fileNameFilter')($scope.files, "160x160");
});

here is the Demo Plunker

update

if your images in like

$scope.files = [
  {name : "name1" , image : "1125495.jpg"},
  {name : "name2" , image : "533123.png"}
];

the you can change the filter like

app.filter("fileNameFilter", function() {
  return function (input, thumbnail) {
    var thumbnailArray = [];
    angular.forEach(input , function(value, key) {
       var parts = value.image.split(".");             // value.image
       var thumb_name = parts[0]+"-"+thumbnail+"."+parts[1];
       thumbnailArray .push(thumb_name);
    });
    return thumbnailArray ;
  }

});

here is the Demo Plunker

And the my concerns is send the thumbnail name from the server-side. seems like much cleaner