在发布和重用值后，在文本区域中显示用换行符分隔的值

Question

我在 MVC、ASP.NET 中有一个使用 angularjs 的解决方案，可以将值输入到文本区域并将它们发布到服务器。我可以使用 ng-model 从服务器接收值并在视图的文本区域中显示它们。但我不确定如何通过换行符显示它们然后重复使用它们（立即重新发布它们）。

1) 首先，用户可以在文本区域中输入值并通过 Return 按钮将它们拆分。这是由ng-list="/\n/"完成的：

<textarea rows="10" cols="80" id="autoGenerateInputField" ng-model="fighterList" ng-list="/\n/" />

2) 然后我通过 angularJS 发布这些值并将它们保存在我的数据库中。

3) 我现在可以从 JSON 中获取这些值。我将它们转换为列表并使用 angularJS 将它们放入 fighterList：

$scope.refreshListTournamentTree = function (CategoryId) {
        var serviceUrl = "/api/Match" + (CategoryId ? "/" + CategoryId : "");
        $http({
            method: 'GET',
            url: serviceUrl
        }).success(function (data, status, headers, config) {
            $scope.treeGenerated = data.length;
            $scope.totalMatches = data;
            var listOfFighters = [];
            if (data.length > 0) {
                $scope.finalMatch = [buildHierarchy(data)[0]];
                for (var i = 0; data.length > i; i++){
                    fighter1 = data[i].Fighter1;
                    fighter2 = data[i].Fighter2;
                    listOfFighters.push(fighter1);
                    listOfFighters.push(fighter2);
                }
            }
            else {
                $scope.finalMatch = [];
            }
            $scope.fighterList = listOfFighters;
            $scope.loading = false;
        }).error(function (data, status, headers, config) {
      });

    }

现在列表显示在文本区域中，但值由“，”分隔，而不是换行。我创建了一个 Fiddle，它显示了我的问题的简化版本：

http://jsfiddle.net/Jtf3M/256/

所以我的问题是：如何在用换行符分隔的文本区域中显示来自 fighterList 的值，以便我可以重用这些值？

Answer 1

您不能简单地添加一个join 吗？ 请参阅更新的小提琴：http://jsfiddle.net/Jtf3M/261/

请查看使用过滤器和 ng-init 的替代方法：http://jsfiddle.net/7516qere/