Question

我的任务是将一个现有的UI集成到另一个已经存在的Angular应用程序中，并挂断了这个...

我知道数据+转换在Angular上下文之外效果很好。

我没有看到用于jQuery json2html的npm软件包，因此我尝试通过将其保存在组件目录旁边以即席方式导入该部分。

它产生ERROR TypeError: $(...).json2html is not a function...

...
import * as $ from 'jquery';
import json2html from 'json2html';
import * from './jquery.json2html.min.js';

...

$('#myTable > tbody').json2html(data,transform);

Answer 1

    npm install node-json2html


    ...
    import json2html from 'json2html';
    import * as $ from 'node-json2html';

    ...

ngAfterViewInit(){
    $('table#myTable > tbody').json2html(data,transform);

}

或

... 
import json2html from 'json2html';
import * as $ from './jquery.json2html.min.js';

...

$('table#myTable > tbody').json2html(data,transform);

链接：-http://www.json2html.com/

Answer 2

在必须将jQuery添加到angular.json之前，然后在组件中使用 jQuery

....
declare let $: any;    // you can use "jQuery" keyword instead of "$"

@component({
  selector: '...',
  templateUrl: ['...'],
  styleUrls: ['...']
})
export class JqueryExampleComponent implements onInit {

  constructor(private eleRef: ElementRef) {}

  ngOnInit() {
    $(this.eleRef.nativeElement).find('#myTable > tbody').json2html(data,transform);
  }
}

当您使用$(this.eleRef.nativeElement)获得component域的树根时，.find('selector')得到您想要的element

如何在Angular中的jQuery中使用json2html？

2 个答案: