角度导入模块错误

时间:2018-01-17 11:19:54

标签: angular angular-cli angular-material2

我有两个模块LibraryModuleChatComponent,我想在LibraryComponent内导入Error: Template parse errors: 'mat-tab' is not a known element: 1. If 'mat-tab' is an Angular component, then verify that it is part of this module. ,但我得到此错误

mat-tab

注意:import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ChatComponent } from './chat.component'; import { RoomsComponent } from './rooms/rooms.component'; import { ChatviewComponent } from './chatview/chatview.component'; @NgModule({ declarations: [ ChatComponent, RoomsComponent, ChatviewComponent ], imports: [ CommonModule ], exports: [ ChatComponent ] }) export class ChatModule { } 来自角料2。

ChatModule

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { SharedModule } from '../../../core/modules/shared.module';
import { LibraryComponent } from './library.component';
import { ChatModule } from '../chat/chat.module';

const routes = [
  {
    path: 'library',
    component: LibraryComponent
  }
];

@NgModule({
  declarations: [
    LibraryComponent,
  ],
  imports: [
    SharedModule,
    ChatModule,
    RouterModule.forChild(routes)
  ],
  exports: [
    LibraryComponent
  ]
})
export class LibraryModule { }

LibraryModule

<mat-tab-group id="chat-tabs">
  <mat-tab label="Rooms">
    <fuse-rooms></fuse-rooms>
  </mat-tab>
  <mat-tab label="Contacts">
  </mat-tab>
</mat-tab-group>

ChatComponent.html

while (true)
            {
                int qw = ololo.WindowHandles.Count;
                string[] wh = ololo.WindowHandles.ToArray();
                ololo.FindElement(By.LinkText("Помощь")).Click();
                Thread.Sleep(1000);
            }

3 个答案:

答案 0 :(得分:3)

您应该添加材料模块。喜欢这个

import {  MdtabModule } from '@angular/material';

我不确定角度素材中是否有MdtabModule

我希望以下讨论可以帮到你。

How to import Angular Material in project?

答案 1 :(得分:3)

显然,您有SharedModule导出已使用的MatTabsModule,您应该始终确保为模板导入正确的模块。

简而言之:

@NgModule({
  declarations: [
    ChatComponent,
    RoomsComponent,
    ChatviewComponent
  ],
  imports: [
    SharedModule        
  ],
  exports: [
    ChatComponent
  ]
})
export class ChatModule {}

这样的印象是你至少有一个SharedModule

@NgModule({
  exports: [
    MatTabsModule,
    CommonModule
  ]
})
export class SharedModule {}

答案 2 :(得分:2)

您可以创建自定义<div class="filter"> <div class="checkbox"> <label><input type="checkbox" rel="canada" onchange="change()"/>Canada</label> </div> <div class="checkbox"> <label><input type="checkbox" rel="china" onchange="change()"/>China</label> </div> <div class="checkbox"> <label><input type="checkbox" rel="usa" onchange="change()"/>USA</label> </div> <div class="checkbox"> <label><input type="checkbox" rel="india" onchange="change()"/>India</label> </div> </div> <div class="result"> <div class="canada"> <h1>Canada</h1> <h2>Jason</h2> </div> <div class="china"> <h1>China</h1> <h2>Ni</h2> </div> <div class="usa"> <h1>USA</h1> <h2>Micheal</h2> </div> <div class="india"> <h1>India</h1> <h2>Alan</h2> </div> <div class="india"> <h1>India</h1> <h2>Alan2</h2> </div> </div>,您可以在其中导入项目中使用的模块。

<强> MaterialModule

MaterialModule

您可以在// Core import { MatTabsModule, MatCheckboxModule, MatInputModule, MatSelectModule, MatButtonModule, MatDialogModule, MatTooltipModule } from '@angular/material'; import { NgModule } from '@angular/core'; @NgModule({ imports: [ MatTabsModule, MatCheckboxModule, MatInputModule, MatSelectModule, MatButtonModule, MatDialogModule, MatTooltipModule ], exports: [ MatTabsModule, MatCheckboxModule, MatInputModule, MatSelectModule, MatButtonModule, MatDialogModule, MatTooltipModule ], }) export class MaterialModule { } 中导入它。

<强> SharedModule

SharedModule