无法绑定到“主题”，因为它不是“ jqxTree”的已知属性

Question

I am using jqxTreeComponent in angular 7 after running below code and cofiguring some setting i am getting this error when doing ng serve.

npm install jqwidgets-scripts --save

I am getting this error when doing ng serve. this is my compoenent template code :

 <div class="tree-container">
          <jqxTree class="tree-container--item" [theme]="'material'" #myTree [width]="300" [height]="450" [source]="records"
            [rtl]="true">
          </jqxTree>
          <div class="tree-container--item">
            <div fxLayout="row">
              <jqxButton [theme]="'material'" (onClick)="AddNode($event)" [width]="125" [height]="25">add</jqxButton>
              <input [(ngModel)]="nodeName"  *ngIf="showTextBox" placeholder="add" />
            </div>
</div>

in addition i added below code in ts file of my component (of course in right place!!)

import { jqxTreeComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxtree';
@ViewChild('myTree') myTree: jqxTreeComponent;

beside this step i added two component in decleration section in app.module.ts file:

import { jqxButtonComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxbuttons';
import { jqxTreeComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxtree';


  jqxButtonComponent, jqxTreeComponent

and as final step i added below code to my tscodfig file:

 "include": [
        "src/**/*"
    ],
    "files": [
        "src/app/app.module.ts",
        "node_modules/jqwidgets-scripts/jqwidgets-ts/angular_jqxbuttons.ts",
        "node_modules/jqwidgets-scripts/jqwidgets-ts/angular_jqxtree.ts"
    ]

Everything seems to be right now i want to know what is the problem??!!!

Answer 1

I have few suggestions please try, hope it helps

1. Make a JqxWidgetsModule

   import { jqxButtonComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxbuttons';
   import { jqxTreeComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxtree';

   @NgModule({
   declarations: [ jqxButtonComponent, jqxTreeComponent],
   exports: [ jqxButtonComponent, jqxTreeComponent]
   })
   export class JqxWidgetsModule { }

Import this module in your LocationModule

    @NgModule({
  declarations: [...],
  imports: [
    CommonModule,
    LocationRoutingModule,
    JqxWidgetsModule
  ]
})
export class LocationModule { }

2. In tsconfig.json file after compilerOptions property add the below config:

   "include": [ "src/**/*.ts", "node_modules/jqwidgets-scripts/jqwidgets-ts/angular_jqxbuttons.ts", "node_modules/jqwidgets-scripts/jqwidgets-ts/angular_jqxtree.ts" ]