Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: mdb-angular-pro-4.3.7. - disappointment

rl pro asked 7 years ago

Hi, I downloaded mdb-angular-pro-4.3.7, unziped it, "npm i" and tried to start server "ng serve -o". Did not succeed - see http://lucan.cz/mdb/error.png OK, fixed by commenting out the 2nd line in app.component.ts. The I added some more code to the app.component.ts and created some components in app.component.html - you may find them here: http://lucan.cz/mdb/app.component.zip App finally started....and to be honest, I am very disappointed with the results :-( 1. navbar: - I open the dropdown menu, click another item in the menu and the dropdown still remains open. 2. mdb-select: - why the property, which is used as a [ngModel] for this control, must be a string? Why mdb-select does not accept numbers? 3. mdb-time-picker: - very nice control, but aboslutely unusable: - it does not read the [ngModel] value as an input - when it is open, you may traverse through other controls pressing tab key. I checked these three components and gave up testing others. Radek

Sand Angel free answered 7 years ago

I wish I see this post before purchasing. I had this error for the first npm install and ng serve

Start your code here
ERROR in AppModule is not an NgModule
 webpack: Failed to compile.

Can I request a refund?

Dawid Adach pro commented 7 years ago

Dear Sand, Could you please write your steps which you made so we could reproduce ? It's sounds little odd as within angular project there is no single file containing "Start your code here" phrase, however it is present in jQuery version. Are you sure that you have cloned correct repo ? I have just tested fresh installation copy from npm and it works like a charm, please provide us stepst which you have taken so we could solve your issue.

Sand Angel free commented 7 years ago

Hi Dawid Adach, Thanks for your answer. My reproduce steps is simple. I download the zip in download section of my account on this page, not on gitlab, Then I open it, run npm install, and ng serve. And the error occurred Actually "Start your code here" is the message added by insert code button and I forgot to clear it. I have this problem with node 8.9.0, npm 5.5.1, mdb-angular-pro 4.3.7 on linux ubuntu 16.04 machine. But on my iMac it work just fine. I'm not on the linux machine now but I will try again tomorrow.

Sand Angel free commented 7 years ago

here is my screenshot. As describe above, I just downloaded a zip file from my account, then yarn install and ng serve. I'm using yarn 1.2.1, node 8.9.0, npm 5.5.1. Since this product is not successfully built for the first time, which mean it's a bad product to me, I request a refund. https://ibb.co/kzKr0w.

Dawid Adach pro commented 7 years ago

Dear Sand, as you noticed, everything works fine on other environments. We are testing our releases on Mac, Windows and Unix (Centos) and they are working fine. This is environment issue so there is not much we can do about that as problem doesn't lays within our product. It looks like known issue to Angular and Ubuntu, check following: https://github.com/angular/angular-cli/issues/4594 https://github.com/angular/angular-cli/issues/3157 https://github.com/angular/angular-cli/issues/5548 IT seems like issue while using yarn install.

Sand Angel free commented 7 years ago

OK. I got it. Thanks for clarifying. I had downloaded ng-pro from gitlab and add it to my project under libs folder, import it from libs folder and my project was able to compile. But there is some warning: WARNING in Circular dependency detected: libs/ng-mdb-pro/free/modals/modal.service.ts -> libs/ng-mdb-pro/free/modals/modalContainer.component.ts -> libs/ng-mdb-pro/free/modals/modal.service.ts WARNING in Circular dependency detected: libs/ng-mdb-pro/free/modals/modalContainer.component.ts -> libs/ng-mdb-pro/free/modals/modal.service.ts -> libs/ng-mdb-pro/free/modals/modalContainer.component.ts WARNING in Circular dependency detected: libs/ng-mdb-pro/pro/accordion/components/sb-item.ts -> libs/ng-mdb-pro/pro/accordion/components/squeezebox.ts -> libs/ng-mdb-pro/pro/accordion/components/sb-item.ts WARNING in Circular dependency detected: libs/ng-mdb-pro/pro/accordion/components/squeezebox.ts -> libs/ng-mdb-pro/pro/accordion/components/sb-item.ts -> libs/ng-mdb-pro/pro/accordion/components/squeezebox.ts I had checked the source code and this warning is totally by your code implementation. Any fix on this?

Dawid Adach pro commented 7 years ago

Dear Sand, does it happen also on Ubuntu 16.04, with node 8.9.0, npm 5.5.1 ?

Sand Angel free commented 7 years ago

Yeah. It happens on my Ubuntu 16.04. node 8.9.0, yarn 1.2.1, npm 5.5.1

Dawid Adach pro commented 7 years ago

Ok Sand, I cannot reproduce it on my Mac nor Centos, I will setup virtual machine with ubuntu and same npm versions and come back to you as soon as I will get resolution.

Sand Angel free commented 7 years ago

As mention in my comment, I had resolved this problem by download the repo from gitlab account, add it to my project and compile it as normal component. But There are some warnings when the compilation has completed, please see my comment below for more info.

Sand Angel free commented 7 years ago

Dear Dawid, I can reproduce the issue on my Mac too. I noticed that the errors occurred when using yarn. Here is my screenshot https://ibb.co/cDqYyG

Dawid Adach pro commented 7 years ago

Dear Sand, our development team is working at the issue at the moment. We will come back as soon as we will resolve the issue.

Sand Angel free commented 7 years ago

Yes. Very please to hear that. Can you provide us a precompiled version instead of source code. Your source code is not compatible with my tsconfig file so it breaks my build. I want to use some typescript features like noUnusedLocals, noUnusedParameters, but since your source code contains a lot of unused stuff, I can't compile it with my source code. I also has mentioned about it and another install issue in this question. Hopefully your team could release a fix and a version compatible with angular 5 soon. <a href="https://mdbootstrap.com/support/precompiled-version/" rel="nofollow">https://mdbootstrap.com/support/precompiled-version/</a>

Dawid Adach pro commented 7 years ago

As discussed we will continue discussion on our BetaTest slack channel

Dawid Adach pro answered 7 years ago

Radek, as per: select - I agree, I didn't mean to say that this is uncommon case therefore we won't support it. I just meant that till now no one ever asked us so somehow we missed that . We will consider adding that in next releases. timepicker - we are aware of that (it was already submitted) , we will fix that in next release so ng model will also update picker itself navbar - checking the issue will come back to you as soon as we will get solution

rl pro answered 7 years ago

Hello Dawid, thanks for your answer. And thank for sending the correct package. Ok, I understand it happens that someone publishes buggy code, this happens to me as well :-) But as for the other issues:
  • mdb select...well, it is not difficult to make workaround converting number to string, but it is a pitty, you loose the type safety. And moreover I think that this is a typical scenario for selects when select contains {value: number, label: text} and the value to match is a number too.
  • mdb timepicker...ok, this workaround should work, but I do not thing this is the best angular way to setup some control value. Would be very nice to have <mdb-timepicker [(ngValue)]="someProperty" ....></mdb-timepicker> for both input and output and nothing more. And other great feature would be if the "someProperty" could be a Date object and the timepicker modifies the time part of the object...but this is kind of Nice To Have :-)
  • and what about the navbar and the tabs "under" the timepicker?
Radek

Maciej Szuchta free commented 7 years ago

Radek According to navbar issue. Please provide me your whole project. I downloaded your app.component files from http://lucan.cz/mdb/app.component.zip and it is working as expected. Navdrop items don't remain open when selected. Send files on m.szuchta@mdbootstrap.com Regards

rl pro commented 7 years ago

Hi Maciej, there is nothnig special in "my project" - I downloaded mdb-angular-pro-4.3.7, "npm i", then updated these two files in the http://lucan.cz/mdb/app.component.zip and "ng serve -o". But maybe I did not say it clearly - yes, the dropdown menu closes corectly when selected some item from the drodown. But the menu remains open when I click another item in the navbar itself - e.g.Home, Features, Pricing. Or the search input box. Radek

Dawid Adach pro commented 7 years ago

Hi Radek, Please check following subject on our support forum. Navbar has .show() and .hide() method which can be used to close navbar. We will add autoclose option within next release. https://mdbootstrap.com/support/close-navbar-after-click/

rl pro commented 7 years ago

Hi David, thanks for answer, I tried it, but did not succeed with the https://mdbootstrap.com/support/close-navbar-after-click/ - check it at http://lucan.cz/mdb/ If I click the navbar.hide() item, which implments the "navbar.hide()" solution, the menu breaks up. But what I would like to solve is that when I open the Dropdown menu and then I select e.g. Home, the dropdown remains still open. I'd love to autoclose it. As for the source - fresh new mdb-angular-pro-4.3.7, npm i, changed app.component files (you can get them at http://lucan.cz/mdb/app.component.zip), ng serve -o Radek

Dawid Adach pro commented 7 years ago

Radek - this will do the trick, update hide option to: hideNavbar( e: any ) { if (e.showClass){ e.hide(); } } this will check whether navbar is expaned or not and won't brake navbar when is not collapes , add to the link : <div> <pre><a class="nav-link" (click)="active = 'features'; hideNavbar(myNavbar);">Features</a></pre> </div>

Dawid Adach pro answered 7 years ago

Dear rl,   My apologies for your inconvenience. The issue with compilation was caused due to important syntax change which happened to Toast Service in last update. I am not sure how did it happen but somehow you have downloaded old package. I've just mailed you correct package. You should also be able to download it from your account at our page. Please also note that version installed via NPM doesn't have that issue. Regarding select, we didn't have request before to support numbers, till now everyone were fine with the strings however we will add this to our to do list and include in future release. Regarding time-picker, the way to set date is to use using ViewChild and AfterViewInit. Check following link for more instructions: https://mdbootstrap.com/support/data-structure-incomplete-for-timepicker/
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

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

Answered

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
About author
rl
Pro User 12Support score
5Questions 3Answers 0Snippets