来自 json Angular ng-repeat 的 Concat 2 数据答案

【问题标题】：Concat 2 datas from json Angular ng-repeat来自 json Angular ng-repeat 的 Concat 2 数据
【发布时间】：2017-01-17 19:11:34
【问题描述】：

我尝试将另一个数组中的数据放入表中的一个部分。我的第一个 json “名称”：

[
        {
            "name": "AAAAAA",
            "down": "False"

        },

        {
            "name": "BBBBBB",
            "down": "True"
        },
        {
            "name": "CCCCC",
            "down": "False"
        }
]

第二个json“数据”：

[
         {
            "data": "35%"
        }
]

Javascript：

 var app = angular.module('app', []);
    app.service('service', function($http, $q){
        this.getNames = function () {
            var names = $http.get('names.json', {cache: false});
            var datas = $http.get('data.json', {cache: false});
            return $q.all({datas,names});
        };

        });
    app.controller('FirstCtrl', function($scope, service, $http) {
            var promise = service.getNames();
            promise.then(function (data) {
                $scope.names = data.names.data;
                $scope.datas = data.datas.data;
                $scope.namesanddata = $scope.names.concat($scope.datas);

                console.log($scope.namesplit);
                console.log($scope.datas);

            });
    });

HTML 表格：

div ng-controller="FirstCtrl"
     <table>
        <tbody>
          <tr ng-repeat="name in namesanddata">
            <td>{{name.name}}</td>
             <td ng-if="name.down=== 'False'">{{name.down}}</td>
             <td ng-if="name.down !== 'False'">{{name.data}}</td>
          </tr>
        </tbody>
      </table>
    </div>

我的问题 - <td ng-if="name.down !== 'False'">{{name.data}}</td>dont 显示在表格中。在console.log中，它连接到像4个对象一样的数组，并且可能由此它不会显示在{{name.name}}旁边的表格中，但我不知道如何从表格中的另一个json显示{{name.data}}而不是{{name.down}}。感谢您提前回答。

【问题讨论】：

是data 还是datas？
json 数据中的数据。我将数据连接到名称然后我在名称中有 4 个对象，其中第四个是 {"data":"35%} - datas 中的数据@PritamBanerjee
"data" 是复数形式。单数是“基准”，但无论如何。

标签： javascript angularjs json ng-repeat

【解决方案1】：

给你一个输出：

AAAAAA  False
BBBBBB  35%
CCCCC   False

从控制器中删除这一行：

$scope.namesanddata = $scope.names.concat($scope.datas);

然后：

解决方案 1 - 视图内嵌

如下更改您的ng-repeat：

<tr ng-repeat="name in names">
    <td>{{ name.name }}</td>
    <td>{{ (name.down === 'False') ? name.down : datas[0].data }}</td>
</tr>

或

解决方案 2 - 使用过滤器保持视图清洁

app.filter('myFilter', function () {
    return function(items, datas) {
        var filtered = [];
        angular.forEach(items, function (i) {
            if (i.down !== "False")
                i.down = datas[0].data;
            filtered.push(i);
        });
        return filtered;
    }
});

如下更改您的ng-repeat：

<tr ng-repeat="name in names | myFilter: datas">
    <td>{{ name.name }}</td>
    <td>{{ name.down }}</td>
</tr>

【讨论】：