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

时间:2017-01-17 19:11:35

标签: javascript angularjs json ng-repeat

我尝试将另一个数组中的数据放入表中的一个部分。 我的第一个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>没有显示在表格中。在console.log中,它会像4对象一样连接到数组,可能由于它不会显示在{{name.name}}旁边的表中,但我不知道如何在表中的另一个json中显示{{name.data}} {{name.down}}。 提前感谢您的回答。

1 个答案:

答案 0 :(得分:1)

为您提供输出:

Book.objects

从Controller中删除此行:

AAAAAA  False
BBBBBB  35%
CCCCC   False

然后:

解决方案1 ​​ - 在视图中内嵌

按如下方式更改$scope.namesanddata = $scope.names.concat($scope.datas);

ng-repeat

解决方案2 - 使用过滤器

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

按如下方式更改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