如何在JavaScript中为数据表添加If条件？

Question

我正在实现数据表这个表包含一个API命中的所有行。我想把条件放在java脚本代码中。通过java脚本创建的数据表。我正在分享我的代码示例。

$scope.standardOptions = DTOptionsBuilder
   .fromFnPromise(R.all('----api call--').getList())
   .withDOM("<'dt-toolbar'<'col-xs-12 col-sm-6'f><'col-sm-6 col-xs-12 hidden-xs'l>r>" +
   "t" +
   "<'dt-toolbar-footer'<'col-sm-6 col-xs-12 hidden-xs'i><'col-xs-12 col-sm-6'p>>")
   .withBootstrap();

$scope.standardColumns = [               
   DTColumnBuilder.newColumn('flightNo').withOption('defaultContent', '-'),
   DTColumnBuilder.newColumn('eta').renderWith(dataRendererETA).withOption('defaultContent', '-'),
   DTColumnBuilder.newColumn('etd').renderWith(dataRendererETA).withOption('defaultContent', '-'),        
];

API调用数据

    {
    "_id": "101-87450458_2016_SEP",
    "flightNo": "087",
    "eta": {
          "$date": 1511868720000
          },
    "etd": {
         "$date": 1511875800000
        },
    }

我想把if条件放在第二个和第三个DtColumnBuilder中。如果要打印或打印eta。

我是数据表中的新手。我怎样才能摆出条件。

  

DTColumnBuilder.newColumn（＆＃39; ETA＆＃39;）renderWith（dataRendererETA）.withOption（＆＃39; defaultContent＆＃39 ;,   ＆＃39; - ＆＃39），              DTColumnBuilder.newColumn（＆＃39; ETD＆＃39）。renderWith（dataRendererETA）.withOption（＆＃39; defaultContent＆＃39 ;,   ＆＃39; - ＆＃39），

我想一次显示一个。

Answer 1

您可以在初始化时执行此操作：

$scope.standardColumns = [               
   DTColumnBuilder.newColumn('flightNo').withOption('defaultContent', '-')
]
if (condition) {
   $scope.standardColumns.push( DTColumnBuilder.newColumn('eta').renderWith(dataRendererETA).withOption('defaultContent', '-') )
} else {
   $scope.standardColumns.push( DTColumnBuilder.newColumn('etd').renderWith(dataRendererETA).withOption('defaultContent', '-') )
}

或者您可以根据条件使用dtInstance创建并隐藏/显示其中一列，例如在$watch中：

$scope.$watch(‘condition’, function(newVal, oldVal) {
  if (newVal) {
    $scope.dtInstance.DataTable.column(1).visible(true)
    $scope.dtInstance.DataTable.column(2).visible(false)
  } else {
    $scope.dtInstance.DataTable.column(1).visible(false)
    $scope.dtInstance.DataTable.column(2).visible(true)
  }
});