How to use fully functioning JsonPath in angular 2+?

Question

I followed https://www.npmjs.com/package/jsonpath. Tried a way to include external js file, but no luck.

Answer 1

import jsonPath worked after -

import * as jsonPath from 'jsonpath/jsonpath';

JsonPath plush also worked JSONPath-plus which is same as of Jsonpath. I have following coding snippet which is working for me-

install JSONPath-plus

npm install jsonpath-plus

angular.json file

"scripts": [
    "node_modules/jsonpath-plus/dist/index-umd.js",
    "src/assets/js/jsonpath.js"
]

jsonpath.js have following code -

function jsonPath() {
  return JSONPath;
}

Now use this function in ts file with declaring it like below -

declare const jsonPath: any;
// use it like
 jsonPath().JSONPath(path, json);

 

Answer 2

Install JSONPath-plus:

npm install jsonpath-plus

In your component file .ts put this:

declare var require: any;
const jsonpath = require('jsonpath-plus');

somewhere in your component:

jsonpath.JSONPath('$.bar', {bar: 777});