时间戳

首页 > 解决方案 > 不使用突出显示 filterData 在全局变量上显示过滤器数据意味着在 Typescript 中的函数之外

jquery - 不使用突出显示 filterData 在全局变量上显示过滤器数据意味着在 Typescript 中的函数之外

问题描述

我正在使用 AngularDataTable一切正常，但是当console我variable在函数下显示但当我在函数console之外时它不显示，console没有任何内容variable是variable空白的。

  @ViewChild(DataTableDirective)
  private datatableElement: DataTableDirective;
  dtOptions: DataTables.Settings = {};

  var getFilterData=""

  this.datatableElement.dtInstance.then((dtInstance: DataTables.Api) => {
      dtInstance
        .on( 'draw', function () {  
          getFilterData=dtInstance.search()
            console.log(getFilterData) //getting filter value
      } );
    })

未获得过滤器值

console.log(getFilterData) // not getting filter value

我的期望是

如何将过滤器值存储在全局变量中意味着在函数之外，我在函数下而不是在函数之外获取值，我想要过滤器突出显示我想要值，如果我得到然后我可以轻松地突出过滤器数据。

标签： jquerytypescriptdatatablesangular6

解决方案

问题是您正在使用javascript function和Typescript function并且在javascript function下该值正在获取，但我认为您没有在Typescript下获得该值，因为这是不同的，该值不会从javascript传递到Typescript。

如果您想突出显示过滤器数据，那么您只需选择 2 个选项，您可以根据自己的选择感到舒适，这里有 2 个选项。

  1. 使用npm依赖npm install julmot/mark.js --save-dev和npm install julmot/datatables.mark.js --save-dev
  2. 使用 CDNhttps://cdn.jsdelivr.net/g/mark.js(jquery.mark.min.js)和https://cdn.datatables.net/plug-ins/1.10.13/features/mark.js/datatables.mark.js

这是链接Link 1和Link 2

并简单地用于突出显示过滤器数据示例

this.dtOptions={
 mark=true
}

和定制

this.dtOptions={
 mark:{
   className: 'highlight'
 }
}

有关标记 js 和高亮文档的更多信息是这里

推荐阅读