未捕获错误:模板解析错误:'app-message-menu'不是已知元素。 Angular 4

时间:2018-05-01 17:50:36

标签: angular angular-components

我有两个组件header-navbar.component.ts和message-menu.component.ts 我想将消息菜单组件html包含到header-navbar组件中,即我想将其作为子组件。

我在app.modules.ts,exports和imports的声明中添加了消息菜单组件。 标题导航栏组件中导入的消息菜单组件。 但我仍然得到错误:

  

未捕获错误:模板解析错误:'app-message-menu'不是   已知元素:    1.如果'app-message-menu'是Angular组件,则验证它是否是此模块的一部分。    2.如果'app-message-menu'是Web组件,则将'CUSTOM_ELEMENTS_SCHEMA'添加到此组件的'@ NgModule.schemas'   取消此消息

标题-navbar.component.ts

import { Component, ViewChild, OnInit, Input, EventEmitter, ViewEncapsulation, OnDestroy, ElementRef, HostListener } from '@angular/core';
import { Router } from '@angular/router';

import { MessageMenuComponent } from '../message-menu/message-menu.component'
declare var jQuery: any;
import {
  OnboardingServiceV2
} from '../../../services/system/onboardingv2/onboarding.service.v2';
@Component({
  selector: 'header-navbar',
  templateUrl: './header-navbar.component.html',
  styleUrls: ['./header-navbar.component.css'],
  host: {'(document:click)': 'onClick($event)'},
  outputs:['onOpenSign'],
  // encapsulation: ViewEncapsulation.None,
  providers: [CollaborationProvider, MessageMenuComponent],
})
export class HeaderNavbarComponent implements OnInit, OnDestroy {

app.module.ts

import { MessageMenuComponent } from './widget-library/rich-elements/message-menu/message-menu.component';

@NgModule({
  declarations: [...
    MessageMenuComponent

 ],
 exports: [
  MessageMenuComponent
  ],

 bootstrap: [AppComponent]
})
export class myModule { }

标题-navbar.component.html

   <app-message-menu></app-message-menu>

消息menu.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-message-menu',
  templateUrl: './message-menu.component.html',
  styleUrls: ['./message-menu.component.css']
})
export class MessageMenuComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

消息menu.component.html

<p>
  message-menu works!
</p>

我已经在stackoverflow上提到了几个问题,并按照所有步骤在另一个组件中使用一个组件,但它没有用。

我提到SO question寻求帮助。

如果需要更多信息,请与我们联系。

1 个答案:

答案 0 :(得分:0)

您不需要导出组件,因为您没有使用共享模块。还要在 from pyspark.sql import Row, functions as F row = Row("UK_1","UK_2","Request_Date",'Approval_Date',"Cat",'Country','State' ) test_df = (sc.parallelize ([ row(1,1,'12/10/2016','10-10-2017',"A",'USA','NY'), row(1,2,None,'10-1-2016','A','CAN','QC'), row(2,1,'14/10/2016',None,'B','USA','FL'), row('A',3,'!~2016/2/276','Bad Date','B','USA',None), row(None,1,'26/09/2016','26/11/08','A',None,'ON'), row(1,1,'12/10/2016','22-02-20','A',None,None), row(1,2,None,'45/45/00','A','MEX','XPZ'), row(2,1,'14/10/2016','None','B','DEU','DUS'), row(None,None,'!~2016/2/276','12-01-2015','B','',''), row(None,1,'26/09/2016',None,'A','USA','CA') ]).toDF()) test_df.show()

中的声明和提供程序下添加必要的提供程序和HeaderNavbarComponent
(
    test_df
    .agg
    (
        F.count('*').alias('count'),
        F.countDistinct('Country').alias('distinct_country')
        #.alias('top_2_countries')
    )
    .show()
)