ControlContainer 没有提供程序 - Angular 5 [英] No provider for ControlContainer - Angular 5

问题描述

我正在将购买的第三方模板转换为 Angular 5 应用程序，但遇到了错误.我对 Angular 5 很陌生(但是我很了解 AngularJS)并且不明白它想告诉我什么?它似乎与显示/隐藏顶部导航栏的按钮有关.

错误信息(来自浏览器):

错误:模板解析错误:ControlContainer 没有提供程序(imalize-styl-2 btn btn-primary"(click)="toggleNavigation()"><i class="fa fa-bars"></i> </a>[错误 ->]
<div class="form-gro"): ng:///AppModule/TopNavigationNavbarComponent.html@4:6

component.html:

<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">
</表单>

<ul class="nav navbar-top-links navbar-right"><li><a href="#"><i class="fa fa-sign-out"></i>登出</a></nav>

component.ts

import { Component, OnInit } from '@angular/core';从'../../../app.helpers'导入{smoothMenu}；声明 var jQuery: 任何;@成分({选择器:'app-top-navigation-navbar',templateUrl: './top-navigation-navbar.component.html',styleUrls: ['./top-navigation-navbar.component.less']})导出类 TopNavigationNavbarComponent 实现 OnInit {切换导航():无效{jQuery('body').toggleClass('mini-navbar');顺利菜单()；}构造函数(){}ngOnInit() {}}

app.module.ts(这似乎是我在谷歌上经常提到的东西，但它不是抛出错误的表单.)

<预><代码>...import { ReactiveFormsModule, FormControl, FormsModule } from '@angular/forms';...

解决方案

import FormsModule 除了 ReactiveFormsModule

I am converting a purchased, third-party template into an Angular 5 app, and just ran into an error. I am very new to Angular 5 (I know AngularJS well however) and don't understand what it's trying to tell me? It seems to be related to a button which shows/hides the top navbar.

Error Message (from browser):

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>

component.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.module.ts (this seems to be something a mentioned a lot when I google this, however it is not the Form throwing the error.)

...
import { ReactiveFormsModule, FormControl, FormsModule } from '@angular/forms';
...

解决方案

import FormsModule in addition to ReactiveFormsModule

这篇关于ControlContainer 没有提供程序 - Angular 5的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！