current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.6 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 1 down vote favorite 
<li ng-repeat="address in search.result.addresses">
<a href ng-click="selectAddress(address)">
  {{address.addressLines}}
</a>
</li>

The problem is with my {{address.addressLines}}

This is currently a string array so my value on screen is printed out like

["address1","address2","address3","address4"]

But I just want it printed like

address1,address2,address3,address4

share|improve this question
3  
Take a look at this answer stackoverflow.com/a/18773958/205859 – Ufuk Hacıoğulları Dec 16 '14 at 14:16
up vote 1 down vote accepted

I thing somthing like this would work... 

<li ng-repeat="address in search.result.addresses">
<a href ng-click="selectAddress(address)">
  <span ng-repeat="a in address.addressLines"> {{a}},</span>
</a>
</li>
share|improve this answer
up vote 8 down vote

There are fundamentally 2 ways:

1) By using native angular directives:

<span ng-init="foo=[1,2,3,4]" ng-app="app">
        <span ng-repeat="f in foo">{{f}}<span ng-if="!$last">,</span></span>
</span>

2) By writing a simple filter (best way):

angular.module('app', []).filter('arrayToList', function(){
        return function(arr) {
            return arr.join(',');
        }
    });

<p>{{foo|arrayToList}}</p>

This is the working example on jsfiddle: http://jsfiddle.net/g0dmazzk/

share|improve this answer
    
A word to option 2. When you use the code in your existing js, make sure to remove the square brackets! Otherwise you'd redefine your module, overriding any includes you made beforehand. Because as it is in the answer, it is the setter for the module. The getter is angular.module('app').filter(... Did cost me some hours, because the error showed up elsewhere. Probably a $injector:unpr Unknown Provider error, because of the overridden includes. – Aaginor Jul 22 '15 at 13:56
    
of course! that was just a quick and dirty code to explain how to create a filter for that purpose :) – daveoncode Jul 22 '15 at 13:59
up vote 2 down vote

You can do this using join also :

 <li ng-repeat="address in search.result.addresses">
        <a href ng-click="selectAddress(address)">
          {{address.addressLines.join()}}
        </a>
     </li>
share|improve this answer
up vote 0 down vote

To avoid dealing with the comma in the last item on the list, I used a class (label from Bootstrap) like this:

<span ng-repeat="a in address.addressLines" class="label label-default"> {{ a }} </span>
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.