Angular JS显示来自Json的字符串数组答案

【问题标题】：Angular JS Display String Array From JsonAngular JS显示来自Json的字符串数组
【发布时间】：2015-02-14 21:08:44
【问题描述】：

<li ng-repeat="address in search.result.addresses">
<a href ng-click="selectAddress(address)">
  {{address.addressLines}}
</a>
</li>

问题出在我的{{address.addressLines}}

这目前是一个字符串数组，所以我在屏幕上的值打印出来就像

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

但我只想把它打印出来

地址1，地址2，地址3，地址4

【问题讨论】：

看看这个答案stackoverflow.com/a/18773958/205859

标签： json angularjs

【解决方案1】：

我觉得这样的事情会起作用......

<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>

【讨论】：

【解决方案2】：

基本上有两种方式：

1) 使用原生 Angular 指令：

<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）通过编写一个简单的过滤器（最好的方法）：

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

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

这是 jsfiddle 上的工作示例：http://jsfiddle.net/g0dmazzk/

【讨论】：

选项2的一句话。当您在现有js中使用代码时，请确保删除方括号！否则，您将重新定义您的模块，覆盖您事先创建的任何包含。因为在答案中，它是模块的 setter。 getter 是 angular.module('app').filter(... 确实花费了我几个小时，因为错误出现在其他地方。可能是 $injector:unpr Unknown Provider 错误，因为覆盖包括。
当然！那只是解释如何为此目的创建过滤器的快速而肮脏的代码:)

【解决方案3】：

你也可以使用 join 来做到这一点：

 <li ng-repeat="address in search.result.addresses">
        <a href ng-click="selectAddress(address)">
          {{address.addressLines.join()}}
        </a>
     </li>

【讨论】：

【解决方案4】：

为了避免处理列表中最后一项中的逗号，我使用了一个类（来自 Bootstrap 的标签），如下所示：

<span ng-repeat="a in address.addressLines" class="label label-default"> {{ a }} </span>

【讨论】：