0

I have an ng-repeat that displays a bunch of long url paths in an input text box.

<div ng-repeat = path in paths>
    <input type="text" value="{{path}}"> 
</div>

the paths looks like this 

endpoint:8000/foo/foo/foo/charlie1.file

I would just like to display the charlie1.file part

I could do it with regex and I even successfully made a function that splits it the path, reverses it, then does a for loop that pushes each character to an array, catches the first "/" then breaks the function, then re-reverses it. Then I have to loop through each path in my api call with this split/reverse function which is cumbersome.

Is there an easier way filter/truncate in angular to achieve this without a bunch of for loops?

Filburt
  • 17,626
  • 12
  • 64
  • 115
Garuuk
  • 2,153
  • 6
  • 30
  • 59

1 Answers1

1

You could just create a simple filter:-

 app.filter('trunc', function(){
     return function(input){
       if(!angular.isString(input)) return;
       return input.split('/').pop();
     }
 });

and do:-

 <input type="text" value="{{path | trunc}}">
PSL
  • 123,204
  • 21
  • 253
  • 243
  • You are welcome. But one question, if you set it as value.. it wont be bound to any model.. Is it editable field or for just display? – PSL Aug 21 '14 at 22:53
  • 1
    Good point. It's just for display and I didn't add it to my op but the text input box is set to readonly. I also have a directive slapped on that allows users to click the text box once and it selects all without having to click and drag to highlight everything. Actually now that I think about it, I'm ganna have to make it so the original filepath gets copied instead of the truncated version – Garuuk Aug 21 '14 at 23:02