Base solution for your next web application
Open Closed

Error invoke combo component #6546


User avatar
0
rbreton created

Hi,

I create a combo component called "departamentos-combo" however when included in the html generates the following errror, please any idea?...

ERROR Error: Uncaught (in promise): Error: Template parse errors: 'departamento-combo' is not a known element:

  1. If 'departamento-combo' is an Angular component, then verify that it is part of this module.
  2. If 'departamento-combo' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("-3"> <div class="form-group"> [ERROR ->]<departamento-combo name="departamentoFilter" [(ngModel)]="role"></departamento-combo> "): ng:///MainModule/ClientesComponent.html@106:36 Error: Template parse errors: 'departamento-combo' is not a known element:
  3. If 'departamento-combo' is an Angular component, then verify that it is part of this module.
  4. If 'departamento-combo' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("-3"> <div class="form-group"> [ERROR ->]<departamento-combo name="departamentoFilter" [(ngModel)]="role"></departamento-combo> "): ng:///MainModule/ClientesComponent.html@106:36 at syntaxError (compiler.js:2426) at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:20600) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:26146) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:26133) at compiler.js:26076 at Set.forEach (<anonymous>) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:26076) at compiler.js:25986 at Object.then (compiler.js:2417) at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:25985) at resolvePromise (zone.js:831) at resolvePromise (zone.js:788) at zone.js:892 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423) at Object.onInvokeTask (core.js:17279) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195) at drainMicroTaskQueue (zone.js:601) defaultErrorLogger @ core.js:15713 push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:15761 next @ core.js:17760 schedulerFn @ core.js:13504 push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub @ Subscriber.js:194 push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next @ Subscriber.js:132 push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next @ Subscriber.js:76 push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next @ Subscriber.js:53 push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next @ Subject.js:47 push../node_modules/@angular/core/fesm5/core.js.EventEmitter.emit @ core.js:13488 (anonymous) @ core.js:17310 push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:391 push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:150 push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:17247 onHandleError @ core.js:17310 push../node_modules/zone.js/dist/zone.js.ZoneDelegate.handleError @ zone.js:395 push../node_modules/zone.js/dist/zone.js.Zone.runGuarded @ zone.js:164 _loop_1 @ zone.js:694 api.microtaskDrainDone @ zone.js:703 drainMicroTaskQueue @ zone.js:608 Promise.then (async) scheduleMicroTask @ zone.js:584 push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:413 onScheduleTask @ zone.js:301 push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404 push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238 push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:258 scheduleResolveOrReject @ zone.js:879 resolvePromise @ zone.js:825 (anonymous) @ zone.js:741 webpackJsonpCallback @ bootstrap:25 (anonymous) @ app-main-main-module.js:1

This is the code that generate the error...

This is the code of the function that populates the combo...

According to the blogs the following code must be included but even so the error persists...


6 Answer(s)
  • User Avatar
    0
    aaron created
    Support Team

    Show how you imported the component.

  • User Avatar
    0
    rbreton created

    Hi @aaron,

  • User Avatar
    1
    aaron created
    Support Team

    Which module are you using it in?

  • User Avatar
    0
    rbreton created

    I use in main module...

    Now I have it, that may be the problem. Let me try and I'll tell you

    @aaron yes indeed that was the problem, thank you very much. Now the error changed, if you have any suggestions I thank you ...

  • User Avatar
    1
    aaron created
    Support Team

    Answered in Can't bind to 'formControl' since it isn't a known property of 'input':

    While using formControl, you have to import ReactiveFormsModule to your imports array.

  • User Avatar
    0
    rbreton created

    @aaron, yes that was!

    I really appreciate your help. Thanks