如何将window.prototype function in JavaScript to angular

Question

I am converting angularJs code to angular code. I have a function in JavaScript. I want to use that in an angular component. I am using angular version 12+

The JavaScript is the below code:

(function(window) {
var nodes = [];
window.JSONLoop = function(obj, idPropertyName, childrenPropertyName) {
  this.id = idPropertyName;
  this.children = childrenPropertyName;
  this.count = 0;
  this.countNodes(obj);
  this.total = this.count + 0;
}

window.JSONLoop.prototype = {
  constructor: JSONLoop,
  isEmpty: function(obj) {
    for(var property in obj) {
      return false;
    }
    return true;
  },
  countNodes: function(obj) {
    var that = this;
    this.count++;
    return function() {
      if (!obj || that.isEmpty(obj)) {
        return false;
      } else {
        if (obj[that.children]) {
          obj[that.children].forEach(function(child) {
            that.countNodes(child);
          });
        }
      }
    }();
  },
  findNodeById: function(obj, id, callback) {
    if (obj[this.id] === id) {
      this.count = this.total + 0;
      callback(null, obj);
    } else {
      if (this.count === 1) {
        this.count = this.total + 0;
        callback('the node does not exist', null);
      }
      this.count--;
      if (obj[this.children]) {
        var that = this;
        obj[this.children].forEach(function(node) {
          that.findNodeById(node, id, callback);
        });
      }
    }
  }, 
}}(window));

In existing angularjs code,the above function is used like this,

 var jsonloop = new JSONLoop(data[0],'id', 'childBeans');
 jsonloop.findNodeById(data[0], dataId.substr(2), function(err, node) {
                      if (err) {
                        childItemObj="";
                      } else {
                        childItemObj=node;
                      }
                    });

Sample JSON-

{
hierarchy: "3"
hierarchyStr: "product"
id: "1730637"
levelId: null
parentId: "0"
smartBeans: Array(4) 
0: {hierarchy: '3.3', hierarchyStr: 'product~@product-1', id: '1730637-1730638',  …}
1: {hierarchy: '3.4', hierarchyStr: 'product~@product-2', id: '1730637-1730670',  …}
2: {hierarchy: '3.5', hierarchyStr: 'product~@product-3', id: '1730637-1730686',  …}
3: {hierarchy: '3.6', hierarchyStr: 'product~@product-4', id: '1730637-1730696',  …}
[[Prototype]]: Object
}

Able to covert the normal functions to angular. But this one has window.prototype. How to convert or use that in angular. I am not sure how to covert the js function of function code to angular and use. Any suggestions will be really helpful. Thanks!

Answer 1

You need to use the es6 version of the same package which is json-digger Below is a working stackblitz example for your reference!

json-digger stackblitz