ng2-codemirror - How to add custom keywords to autocomplete (hint)

Question

I want to add custom autocomplete list(hint) that get from an API call in a ng2-codemirror editor. I found this solution [CodeMirror AutoComplete Custom List ] from SO.But I'm getting an error when accessing,

CodeMirror.hint.javascript // ERROR TypeError: Cannot read property 'javascript' of undefined

This is my component class.

import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core';

import "codemirror/lib/codemirror";
import "codemirror/mode/javascript/javascript";
import "codemirror/addon/hint/show-hint";
import "codemirror/addon/hint/javascript-hint";

declare let CodeMirror: any;

@Component({
  selector: 'my-editor',
  templateUrl: './editor.component.html',
  styleUrls: ['./editor.component.scss']
})
export class SearchComponent implements AfterViewInit {

  @ViewChild('editor') editor;
  query: string = '';

  config = {
    mode: 'javascript',
    lineNumbers: false,
    theme: 'eclipse',
    extraKeys: {"Ctrl-Space": "autocomplete"},
  };

  constructor(private searchService: SearchService) {
  }

  ngAfterViewInit(): void {
    console.log(this.editor.instance);
    let orig = CodeMirror.hint.javascript; 
    console.log(orig);
  }
}

Does anyone know a fix for this issue or any better way to add custom keywords to autocomplete dropdown.

Thanks