angular2-multiselect-dropdown icon indicating copy to clipboard operation
angular2-multiselect-dropdown copied to clipboard

Error implement it in Angular 7

Open AlanValenzuelaSimpson opened this issue 4 years ago • 2 comments

Hi Guys, I have a proble to implement it in Angular 7, I follow the documentation and it doesn't work

In my module I have: import { FormsModule } from '@angular/forms'; import { AngularMultiSelectModule } from 'angular2-multiselect-dropdown';

imports: [ ... AngularMultiSelectModule, FormsModule, ... ],

HTML <angular2-multiselect [data]="itemList" [(ngModel)]="selectedItems" [settings]="settings" (onSelect)="onItemSelect($event)" (onDeSelect)="OnItemDeSelect($event)" (onSelectAll)="onSelectAll($event)" (onDeSelectAll)="onDeSelectAll($event)">

In the .ts I have the vars and all the functions

Error: `compiler.js:2547 Uncaught Error: Template parse errors: Can't bind to 'data' since it isn't a known property of 'angular2-multiselect'.

  1. If 'angular2-multiselect' is an Angular component and it has 'data' input, then verify that it is part of this module.
  2. If 'angular2-multiselect' 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. ("
    ][data]="itemList" [(ngModel)]="selectedItems" [settings]="settings"

    "): ng:///ComponenetsModule/FiltroFechaEscuelaComponent.html@91:10 Can't bind to 'settings' since it isn't a known property of 'angular2-multiselect'.

    1. If 'angular2-multiselect' is an Angular component and it has 'settings' input, then verify that it is part of this module.
    2. If 'angular2-multiselect' 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. (" [data]="itemList" [(ngModel)]="selectedItems" [ERROR ->][settings]="settings" (onSelect)="onItemSelect($event)" (onDeSelect)="OnItemDeSe"): ng:///ComponenetsModule/FiltroFechaEscuelaComponent.html@93:10 'angular2-multiselect' is not a known element:
    4. If 'angular2-multiselect' is an Angular component, then verify that it is part of this module.
    5. If 'angular2-multiselect' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("
      [ERROR ->]

      "): ng:///ComponenetsModule/FiltroFechaEscuelaComponent.html@90:8 at syntaxError (compiler.js:2547) at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:19495) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:25041) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:25028) at compiler.js:24971 at Set.forEach () at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:24971) at compiler.js:24881 at Object.then (compiler.js:2538) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:24880) syntaxError @ compiler.js:2547 push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse @ compiler.js:19495 push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate @ compiler.js:25041 push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate @ compiler.js:25028 (anonymous) @ compiler.js:24971 push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileComponents @ compiler.js:24971 (anonymous) @ compiler.js:24881 then @ compiler.js:2538 push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAndComponents @ compiler.js:24880 push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAsync @ compiler.js:24840 push../node_modules/@angular/platform-browser-dynamic/fesm5/platform-browser-dynamic.js.CompilerImpl.compileModuleAsync @ platform-browser-dynamic.js:143 compileNgModuleFactory__PRE_NGCC @ core.js:14376 push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule @ core.js:14559 ./src/main.ts @ main.ts:11 webpack_require @ bootstrap:78 0 @ main.ts:12 webpack_require @ bootstrap:78 checkDeferredModules @ bootstrap:45 webpackJsonpCallback @ bootstrap:32 (anonymous) @ main.js:1`

      error

AlanValenzuelaSimpson avatar Apr 30 '20 19:04 AlanValenzuelaSimpson

@CuppaLabs some do you have some ideas to resolve that? thx u

AlanValenzuelaSimpson avatar May 04 '20 15:05 AlanValenzuelaSimpson

Import the FormsModule

danielsogl avatar Jul 19 '20 14:07 danielsogl