Topic: 'mdb-select' is not a known element:
fodxp free asked 5 years ago
Hello MDB Support,
I am using ng-uikit-pro-standard-7.0.0 and following the angular multiselect documentation here
https://mdbootstrap.com/docs/angular/forms/multiselect/
The vscode editor has a compile error - 'mdb-select' is not a known element:
And when I try ng serve, I get the following compilation errors
ERROR in node_modules/ng-uikit-pro-standard/ng-uikit-pro-standard/pro/autocomplete/services/data-factory.service.d.ts(1,22): error TS2307: Cannot find module '@angular/http'.
node_modules/ng-uikit-pro-standard/ng-uikit-pro-standard/pro/autocomplete/services/remote-data.service.d.ts(1,47): error TS2307: Cannot find module '@angular/http'.
Here's the code
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
// MDB
import { MDBBootstrapModulesPro } from 'ng-uikit-pro-standard';
import { MDBSpinningPreloader } from 'ng-uikit-pro-standard';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HttpClientModule,
MDBBootstrapModulesPro.forRoot(), BrowserAnimationsModule// mdb
,ReactiveFormsModule,FormsModule
],
providers: [MDBSpinningPreloader],
bootstrap: [AppComponent]
})
export class AppModule { }
import { Component, OnInit } from '@angular/core';
@Component({
selector:'app-root',
templateUrl:'./app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
title='multiselect';
optionsSelect:Array<any>;
ngOnInit() {
this.optionsSelect= [
{ value: '1', label: 'Option 1' },
{ value: '2', label: 'Option 2' },
{ value: '3', label: 'Option 3' },
];
}
}
<div style="text-align:center">
<h1>
Welcome to {{ title }}!
</h1>
<divclass="row">
<divclass="col-md-6">
<mdb-select[options]="optionsSelect"[multiple]="true"placeholder="Choose your option"></mdb-select>
<label>Example label</label>
</div>
</div>
Appreciate your help.
Thanks.
Damian Gemza staff answered 5 years ago
Dear @fodxp
Please add @angular/http package to your package.json file, and execute npm install one more time.
After this, everything should be okay.
Best Regards,
3Damian
fodxp free answered 5 years ago
Hello Damian,
I am using Angular 7. I have emailed the application.zip to you.
Thanks,
ng v
Angular CLI: 7.1.1
Node: 8.11.3
OS: darwin x64
Angular: 7.1.1
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.11.1
@angular-devkit/build-angular 0.11.1
@angular-devkit/build-optimizer 0.11.1
@angular-devkit/build-webpack 0.11.1
@angular-devkit/core 7.1.1
@angular-devkit/schematics 7.1.1
@ngtools/webpack 7.1.1
@schematics/angular 7.1.1
@schematics/update 0.11.1
rxjs 6.3.3
typescript 3.1.6
webpack 4.23.1
Damian Gemza staff answered 5 years ago
Dear @fodxp
Could you please confirm, if you're using Angular 7 or Angular 6?
Tried to reproduce your problem on application with Angular 7, but without success. Multi select is working fine for me, both ng serve and ng serve --prod.
Could you please also provide me the reproduction repository? You can send it to me here: d.gemza@mdbootstrap.com
Best Regards,
Damian
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 6.2.3
- Device: desktop
- Browser: chrome
- OS: OSX
- Provided sample code: Yes
- Provided link: Yes