Topic: Minimalist charts with angular mdb

Hosboss pro asked 6 years ago


The Minimalist charts (mdb-simple-chart) does not work with angular, here is the error message I get:
Uncaught Error: Template parse errors:
Can't bind to 'percent' since it isn't a known property of 'mdb-simple-chart'.
1. If 'mdb-simple-chart' is an Angular component and it has 'percent' input, then verify that it is part of this module.
2. If 'mdb-simple-chart' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("reen">Economie <i class="fa fa-arrow-circle-up"></i></span>-->
Thank you for your help.

Edyta Dabrowska free answered 6 years ago


If you have exactly the same problem, then this will be fixed in the future on our side.

Edyta Dabrowska free answered 6 years ago


Right now 4.1.0 documentation is fully working. What errors do you get? I don't know your code so maybe this could help: https://angular.io/guide/dependency-injection-in-action#dependency-injection

Hosboss pro commented 6 years ago

Hi, Thank you, I have the same problem as on this post: <a href="https://mdbootstrap.com/support/toastrmodule-is-already-loaded-error-after-upgrade/" rel="nofollow">https://mdbootstrap.com/support/toastrmodule-is-already-loaded-error-after-upgrade/</a>

Edyta Dabrowska free answered 6 years ago


Here you can find documentation to 4.1.0. While updating you just need to move typescript, fonts, scss and img folders to your project and then npm i. Please try this and let me know how it works.

Hosboss pro commented 6 years ago

Bonjour, Thank you for the documentation, but it lacks all the "Advanced" and lightbox among others. Otherwise I just tested the update as you describe it and I fall back on the same errors.

Edyta Dabrowska free answered 6 years ago


Please tell me are you using rotating cards in your projects? If yes, what selector does it have?

Hosboss pro commented 6 years ago

Yes, I use it, (with the selector 'mdb-card-rotating') but this is not the problem, the error is done on any directive if I do not put MDBBootstrapModule.forRoot () MDBBootstrapModulePro.forRoot (), in each module and this may be what makes the mistake: 'WARNING in Circular dependency detected:' and Error: ToastModule is already loaded. It should only be imported in your application's main module. In any case, I can not use version 4.3.1 and I am back on version 4.1.0. Or can we find the documentation for this version?

Edyta Dabrowska free answered 6 years ago


It seems like you are importing modals in 2 places. Modals should be only imported in your app.module.ts.

Hosboss pro commented 6 years ago

I import MDBBootstrapModule.forRoot (), MDBBootstrapModulePro.forRoot (), in each module because otherwise I have another error: ERROR Error: Uncaught (in promise): Error: Template parse errors: 'Mdb-card-rotating' is not a known element: 1. If 'mdb-card-rotating' is an Angular component, then verify that it is part of this module. 2. If 'mdb-card-rotating' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@ NgModule.schemas' of this component to suppress this message. ( ' [ERROR ->] (I did it on version 4.1.0 and it was not a problem).

Hosboss pro answered 6 years ago


Hi, I am currently upgrading my project to version 4.3.1 and I think this will solve my problems. On the other hand I have warning to the compilation with this version:   WARNING in Circular dependency detected: srcapptypescriptsfreemodalsmodal.service.ts -> srcapptypescriptsfreemodalsmodalContainer.component.ts -> srcapptypescriptsfreemodalsmodal.service.ts WARNING in Circular dependency detected: srcapptypescriptsfreemodalsmodalContainer.component.ts -> srcapptypescriptsfreemodalsmodal.service.ts -> srcapptypescriptsfreemodalsmodalContainer.component.ts WARNING in Circular dependency detected: srcapptypescriptsproaccordioncomponentssb-item.ts -> srcapptypescriptsproaccordioncomponentssqueezebox.ts -> srcapptypescriptsproaccordioncomponentssb-item.ts WARNING in Circular dependency detected: srcapptypescriptsproaccordioncomponentssqueezebox.ts -> srcapptypescriptsproaccordioncomponentssb-item.ts -> srcapptypescriptsproaccordioncomponentssqueezebox.ts WARNING in Circular dependency detected: srcapptypescriptsproalertstoasttoast.component.ts -> srcapptypescriptsproalertstoasttoast.service.ts -> srcapptypescriptsproalertstoasttoast.component.ts WARNING in Circular dependency detected: srcapptypescriptsproalertstoasttoast.service.ts -> srcapptypescriptsproalertstoasttoast.component.ts -> srcapptypescriptsproalertstoasttoast.service.ts   And this makes a mistake on the explorer: ERROR Error: Uncaught (in promise): Error: ToastModule is already loaded. It should only be imported in your application's main module. Error: ToastModule is already loaded. It should only be imported in your application's main module. at new ToastModule (toast.module.ts:37) at _createClass (core.es5.js:9520) at _createProviderInstance$1 (core.es5.js:9492) at initNgModule (core.es5.js:9446) at new NgModuleRef_ (core.es5.js:10560) at createNgModuleRef (core.es5.js:10544) at Object.debugCreateNgModuleRef [as createNgModuleRef] (core.es5.js:12843) at NgModuleFactory_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleFactory_.create (core.es5.js:13838) at MapSubscriber.project (router.es5.js:3520) at MapSubscriber.webpackJsonp.../../../../rxjs/operator/map.js.MapSubscriber._next (map.js:77) at new ToastModule (toast.module.ts:37) at _createClass (core.es5.js:9520) at _createProviderInstance$1 (core.es5.js:9492) at initNgModule (core.es5.js:9446) at new NgModuleRef_ (core.es5.js:10560) at createNgModuleRef (core.es5.js:10544) at Object.debugCreateNgModuleRef [as createNgModuleRef] (core.es5.js:12843) at NgModuleFactory_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleFactory_.create (core.es5.js:13838) at MapSubscriber.project (router.es5.js:3520) at MapSubscriber.webpackJsonp.../../../../rxjs/operator/map.js.MapSubscriber._next (map.js:77) at resolvePromise (zone.js:795) at resolvePromise (zone.js:766) at zone.js:844 at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:425) at Object.onInvokeTask (core.es5.js:3881) at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424) at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:192) at drainMicroTaskQueue (zone.js:602) at <anonymous>

Edyta Dabrowska free answered 6 years ago


Hi, could you please tell me what version exactly do you use? And please send me some of your code snippet with mdb-simple-chart.

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags