Dashboard widget in 7.4 not working

I followed this example: https://docs.litium.com/documentation/litium-documentation/dashboard/how-to-create-your-own-widgets_3#Litium%208%20and%20newer%20versions

When i drag/drop the widget to the dashboard i get these errors and cannot get it to show. I have added the component to extensions.ts… and everything compiles. Any suggestions?

vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:523 ERROR Error: Uncaught (in promise): TypeError: Cannot read property ‘call’ of undefined
TypeError: Cannot read property ‘call’ of undefined
at webpack_require (manifest.js?v=A98408774B38038F9E1555D728BF8229436003C116208C9D097D8A2F6E55A4D4:1)
at Module…/Accelerator/extensions.ts (Accelerator.js:1)
at webpack_require (manifest.js?v=A98408774B38038F9E1555D728BF8229436003C116208C9D097D8A2F6E55A4D4:1)
at main.js?v=352095466AA2E6F9D9C43B1FD62132B7BF5A535CA9DDD1559C055319EC66900F:1
at ZoneDelegate.invoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Object.onInvoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:1282)
at ZoneDelegate.invoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Zone.run (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529
at ZoneDelegate.invokeTask (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at resolvePromise (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529)
at vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529
at rejected (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2514)
at ZoneDelegate.invoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Object.onInvoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:1282)
at ZoneDelegate.invoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Zone.run (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529
at ZoneDelegate.invokeTask (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Object.onInvokeTask (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:1282)
defaultErrorLogger @ vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:523
5vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:523

ERROR Error: Uncaught (in promise): Error: No NgModule metadata found for ‘undefined’.
Error: No NgModule metadata found for ‘undefined’.
at NgModuleResolver.resolve (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2033)
at CompileMetadataResolver.getNgModuleMetadata (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2026)
at JitCompiler._loadModules (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2091)
at JitCompiler._compileModuleAndAllComponents (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2091)
at JitCompiler.compileModuleAndAllComponentsAsync (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2091)
at CompilerImpl.compileModuleAndAllComponentsAsync (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2184)
at DynamicComponentCreatorService. (main.js?v=352095466AA2E6F9D9C43B1FD62132B7BF5A535CA9DDD1559C055319EC66900F:1)
at step (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2514)
at Object.next (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2514)
at fulfilled (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2514)
at resolvePromise (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529)
at vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529
at rejected (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2514)
at ZoneDelegate.invoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Object.onInvoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:1282)
at ZoneDelegate.invoke (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Zone.run (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2529
at ZoneDelegate.invokeTask (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:2521)
at Object.onInvokeTask (vendor.js?v=E14E823ED408C5505672C318CDBB5A5E40B204FAABDEDC8A8B1D48C9895D11ED:1282)

Have you registered the component in the module, which is described in " Register components in AcceleratorModule"?

Please build the project in development mode so it produces better error log.

i will try building i develop… and yes i did register it, and i explicitly wrote that i did so in my message above :stuck_out_tongue:

built in develop-mode, it says the error is on this line of my widget:

export class TaskMonitorWidget extends BaseWidget {

ERROR Error: Uncaught (in promise): TypeError: Cannot read property ‘call’ of undefined
TypeError: Cannot read property ‘call’ of undefined

The entire thing looks like this:

import { Component, ChangeDetectionStrategy } from ‘@angular/core’;

import { NgRedux } from ‘@angular-redux/store’;

import { FormGroup, FormBuilder, Validators } from ‘@angular/forms’;

import { BaseWidget, DashboardWidgetActions, IAppState } from ‘litium-ui’;

@Component({

selector: 'task-monitor-widget',

templateUrl: './task-monitor-widget.component.html',

changeDetection: ChangeDetectionStrategy.OnPush, 

})

export class TaskMonitorWidget extends BaseWidget {

constructor(ngRedux: NgRedux<IAppState>, formBuilder: FormBuilder, widgetActions: DashboardWidgetActions) {

    super(ngRedux, formBuilder, widgetActions);

}



createSettingsFormGroup(): FormGroup {

    return this.formBuilder.group({

        name: ['', Validators.required]

    });

}

}

tried removing node_mudules and npm install just for fun… no difference.

Just downloaded the fresh accelerator 7.4.2 and I can create a custom widget without any problem.

Did you upgrade the site or is it the fresh 7.4?

If it is an upgraded site, please try to delete node_modules folder, clean npm cache and execute the BuildClientProjects.bat file again.

it is upgraded site

Have you tried to clean npm cache? What version of litium-ui do you have in package.json?

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.