Javascript 根据角度变量值的位置在表中显示角度变量值_Javascript_Html_Angularjs

Javascript 根据角度变量值的位置在表中显示角度变量值

javascript html angularjs

Javascript 根据角度变量值的位置在表中显示角度变量值,javascript,html,angularjs,Javascript,Html,Angularjs,我有一个角度变量，它的值是[170,1130,3134,4…，等等]。我想以这样的形式显示它，即表中的值显示在两列中，例如，一列中的所有偶数位置值和另一列中的所有奇数位置值 col1 col2 170 1 130 3 134 4 我已经编写了以下代码，但它在一列中显示所有代码。请。建议解决方案。提前感谢 <table class="table"> <tr ng-repeat="item in output track by $index

我有一个角度变量，它的值是[170,1130,3134,4…，等等]。我想以这样的形式显示它，即表中的值显示在两列中，例如，一列中的所有偶数位置值和另一列中的所有奇数位置值

col1    col2
170     1
130     3
134     4

我已经编写了以下代码，但它在一列中显示所有代码。请。建议解决方案。提前感谢

<table class="table">
     <tr ng-repeat="item in output track by $index" ng-switch="$even" ng-class-even="'even'" ng-class-odd="'odd'">
          <td ng-switch-when="true">{{item}}</td>
          <td ng-switch-default>{{item}}</td> 
     </tr>

当

td

打开时，不要使用

ngswitch。相反，在td
内部使用div
，如下所示：
 <td>
     <div ng-switch-when="true">{{item}}</div>
 </td>
 <td>
     <div ng-switch-default>{{item}}</div>
 </td> 


{{item}}
{{item}}

这将保证两列。您可以做的另一件事是为大小相同的列设置两个td
的宽度。
您可以使用“模数%”获得奇偶数并相应地打印。在“ng开关”中写入表达式，并检查如下示例中的值：
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    </head>
    <body>

        <div  ng-app="myApp" ng-controller="myCtrl">

            <span  ng-repeat="obj in items">
                    <div ng-switch on="{{obj%2}}"> 
                        <div ng-switch-when="1">Odd: {{obj}}</div>
                        <div ng-switch-when="0">Even: {{obj}}</div>
                     </div>
      <div></div>

   </div>
            </span>

        </div>

        <script>
            var app = angular.module('myApp', []);
            app.controller('myCtrl', function($scope) {
                $scope.items = [12,11,34,33,54];                
            });
        </script>
    </body>
</html>


奇数：{obj}
偶数：{{obj}
var-app=angular.module（'myApp'，[]）；
应用程序控制器（'myCtrl'，函数（$scope）{
$scope.items=[12,11,34,33,54]；
});

这里是fiddle:
您可以通过在奇偶值中重新解析数组来实现这一点：
JS:
var-app=angular.module（“app”，[]）；
应用程序控制器（'dummy'，函数（$scope，$location）{
var输出=[170,1130,3134,4]，奇数=[]，偶数=[]；
对于（变量i=0；i

HTML:

{{odd}}
{{output.偶数[$index]}


<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    </head>
    <body>

        <div  ng-app="myApp" ng-controller="myCtrl">

            <span  ng-repeat="obj in items">
                    <div ng-switch on="{{obj%2}}"> 
                        <div ng-switch-when="1">Odd: {{obj}}</div>
                        <div ng-switch-when="0">Even: {{obj}}</div>
                     </div>
      <div></div>

   </div>
            </span>

        </div>

        <script>
            var app = angular.module('myApp', []);
            app.controller('myCtrl', function($scope) {
                $scope.items = [12,11,34,33,54];                
            });
        </script>
    </body>
</html>

var app = angular.module("app", []);
app.controller('dummy', function($scope, $location) {
  var output = [170, 1, 130, 3, 134, 4], odd = [], even = [];
  for (var i = 0; i < output.length; i++) {
    if ((i + 2) % 2 == 0) {
      odd.push(output[i]);
    } else {
      even.push(output[i]);
    }
  }
  $scope.output = {odd: odd, even: even};
});

<div ng-app="app" ng-controller="dummy">
  <table>
    <tr ng-repeat="odd in output.odd track by $index">
      <td>{{odd}}</td>
      <td>{{output.even[$index]}}</td>
    </tr>
  </table>
</div>