Pas de fournisseur pour ControlContainer - Angulaire 5

Je suis de la conversion d'un acheté, un tiers de modèle en angle 5 app, et viens de tomber sur une erreur. Je suis très nouveau à Angulaires 5 (je sais AngularJS bien cependant) et ne comprennent pas ce qu'il cherche à me dire? Il semble être lié à un bouton qui affiche/masque la barre de navigation en haut.

Message d'erreur (dans le navigateur):

Error: Template parse errors:
No provider for ControlContainer ("imalize-styl-2 btn btn-primary " (click)="toggleNavigation()"><i class="fa fa-bars"></i> </a>
      [ERROR ->]<form role="search" class="navbar-form-custom" method="post" action="#">
        <div class="form-gro"): ng:///AppModule/TopNavigationNavbarComponent.html@4:6

component.html:

<div class="row border-bottom">
  <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
    <div class="navbar-header">
      <a class="minimalize-styl-2 btn btn-primary " (click)="toggleNavigation()"><i class="fa fa-bars"></i> </a>
      <form role="search" class="navbar-form-custom" method="post" action="#">
        <div class="form-group">
          <input type="text" placeholder="Search for something..." class="form-control" name="top-search" id="top-search">
        </div>
      </form>
    </div>
    <ul class="nav navbar-top-links navbar-right">
      <li>
        <a href="#">
          <i class="fa fa-sign-out"></i> Log out
        </a>
      </li>
    </ul>
  </nav>
</div>

composant.ts

import { Component, OnInit } from '@angular/core';
import { smoothlyMenu } from '../../../app.helpers';

declare var jQuery: any;

@Component({
  selector: 'app-top-navigation-navbar',
  templateUrl: './top-navigation-navbar.component.html',
  styleUrls: ['./top-navigation-navbar.component.less']
})
export class TopNavigationNavbarComponent implements OnInit {

  toggleNavigation(): void {
    jQuery('body').toggleClass('mini-navbar');
    smoothlyMenu();
  }

  constructor() { }

  ngOnInit() {
  }

}

app.le module.ts (cela semble être quelque chose d'un, mentionné beaucoup quand j'google ceci, cependant elle n'est pas la Forme de jeter de l'erreur.)

...
import { ReactiveFormsModule, FormControl, FormsModule } from '@angular/forms';
...
InformationsquelleAutor Todd Davis | 2018-01-11
  1. 35

    importation FormsModule en plus de ReactiveFormsModule

    • Ce n'est pas de faire une différence pour moi. Obtenez toujours l'erreur
    • partager l'extrait de code de module et de l'erreur
    • Fait le tour. Merci pour le sage de réponse.
    InformationsquelleAutor blazehub
  2. 12

    Je ne sais pas pourquoi le message d'erreur semble indiquer la balise d'ancrage à l'extérieur de l'élément de formulaire, mais c'est la forme de l'élément qui a été la cause de l'erreur. L'ajout de FormGroup à la forme fixe le problème.

    <form role="search" class="navbar-form-custom" [formGroup]="form">
    • J'ai fait face à un même problème. J'ai 2 formulaires en deux composantes distinctes. Je me suis converti à seulement 1 dans Angulaire et eu cette erreur. J'ai pour convertir les formes Angulaire du style à faire l'application fonctionne à nouveau
    InformationsquelleAutor Todd Davis
  3. 11

    Importation FormsModule et ReactiveFormsModule dans views.module.ts(custome module fichier) fichier fonctionne pour moi :

    points de vue.le module.ts

    import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';


@NgModule({
  imports: [
    CommonModule,
    RouterModule,
    FormsModule,
    ReactiveFormsModule,
    ...
  ],
  declarations: [
    ...
  ],
  exports: [
   ...
  ],
  schemas: [NO_ERRORS_SCHEMA]
})
export class ViewsModule { }
    InformationsquelleAutor Govind Samrow