Javascript 绑定时特殊字符后的AngularJs新行

我有一个angularJS项目，在该项目中，我从服务器请求数据，并返回JSON对象，其中包含国家名称列表，如下所示：

$scope.countries=[{
   countriesName : 'USA, England, Germany, France'
}];

<tbody>
   <tr ng-repeat="country in countries">
          <td>{{country.countriesName }}</td>
    </tr>
</tbody>

Countries Name :
-----------------
USA,
England,
Germany,
France

因此，当我绑定数据以在视图中呈现它时，我使用如下方式使用

ng repeat

：

$scope.countries=[{
   countriesName : 'USA, England, Germany, France'
}];

<tbody>
   <tr ng-repeat="country in countries">
          <td>{{country.countriesName }}</td>
    </tr>
</tbody>

Countries Name :
-----------------
USA,
England,
Germany,
France

但在视图中，我想用特殊字符分割这些名称，在本例中是“（，），然后将下一个名称写在同一行的新行中

因此，预期的视图如下所示：

$scope.countries=[{
   countriesName : 'USA, England, Germany, France'
}];

<tbody>
   <tr ng-repeat="country in countries">
          <td>{{country.countriesName }}</td>
    </tr>
</tbody>

Countries Name :
-----------------
USA,
England,
Germany,
France

注意： -绑定国家名称返回一个字符串行，我一次将这些名称绑定到一个表中

---

-我想要一个带有4行不同行的

您可以在将

countriesName

按空格分割后生成不同的

div

s。由于

div

s具有块显示，因此内容将自动占用新行

我更希望这种方法不处理生成HTML内容的清理（通过使用

标记），因为它需要包含

ngSanitize

模块

angular.module（'app'，[]）
.controller（'ctrl'，函数（$scope）{
$scope.countries=[{
国家名称：“美国、英国、德国、法国”
}];
})

{{line}}

请尝试以下方法：

<tbody>
   <tr ng-repeat="country in countries">
          <td ng-repeat="name in country.countriesName.split(',')">
              {{ name }}
          </td>
    </tr>
</tbody>

{{name}}