' ng4geo-自动完成'不是已知元素:

时间:2017-11-27 11:15:58

标签: angular

'ng4geo-autocomplete' is not a known element:

这是在header.component.html:

 <div>
    <ng4geo-autocomplete (componentCallback)="autoCompleteCallback2($event)"></ng4geo-autocomplete>
 </div>

这是header.component.ts:

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

import {
    Ng4GeoautocompleteModule
} from 'ng4-geoautocomplete';

//@Component({
//        selector: 'layout-header',
//        templateUrl: 'app/Components/header.component.html'
//    })
@Component({
    selector: 'any-component-name',
    encapsulation: ViewEncapsulation.None,
    template: '<div class="demo"><ng4geo-autocomplete (componentCallback)="autoCompleteCallback1($event)"></ng4geo-autocomplete></div>',

})
export class HeaderComponent {
}

我在angular4项目上安装npm install --save ng4-geoautocomplete。 谁能告诉我这是什么问题?

以下是总错误:

"Uncaught (in promise): Error: Template parse errors:
'ng4geo-autocomplete' is not a known element:
1. If 'ng4geo-autocomplete' is an Angular component, then verify that it is part of this module.
2. If 'ng4geo-autocomplete' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("         </div>
                                    <div>
                                        [ERROR ->]<ng4geo-autocomplete  (componentCallback)="autoCompleteCallback2($event)"></ng4geo-autocomplete>
   "): ng:///app/Components/header.component.html@195:40
Error: Template parse errors:
'ng4geo-autocomplete' is not a known element:
1. If 'ng4geo-autocomplete' is an Angular component, then verify that it is part of this module.
2. If 'ng4geo-autocomplete' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("         </div>
                                    <div>
                                        [ERROR ->]<ng4geo-autocomplete  (componentCallback)="autoCompleteCallback2($event)"></ng4geo-autocomplete>
   "): ng:///app/Components/header.component.html@195:40
    at Error.ZoneAwareError (http://localhost:13244/node_modules/zone.js/dist/zone.js:992:33)
    at ZoneAwareError (http://localhost:13244/node_modules/zone.js/dist/zone.js:989:35)
    at syntaxError (http://localhost:13244/node_modules/@angular/compiler/bundles/compiler.umd.js:1513:34)
    at TemplateParser.parse (http://localhost:13244/node_modules/@angular/compiler/bundles/compiler.umd.js:11522:19)
    at JitCompiler._compileTemplate (http://localhost:13244/node_modules/@angular/compiler/bundles/compiler.umd.js:25296:39)
    at eval (http://localhost:13244/node_modules/@angular/compiler/bundles/compiler.umd.js:25220:62)
    at Set.forEach (<anonymous>)
    at JitCompiler._compileComponents (http://localhost:13244/node_modules/@angular/compiler/bundles/compiler.umd.js:25220:19)
    at createResult (http://localhost:13244/node_modules/@angular/compiler/bundles/compiler.umd.js:25105:19)
    at ZoneDelegate.invoke (http://localhost:13244/node_modules/zone.js/dist/zone.js:334:26)
    at Zone.run (http://localhost:13244/node_modules/zone.js/dist/zone.js:126:43)
    at http://localhost:13244/node_modules/zone.js/dist/zone.js:713:57
    at ZoneDelegate.invokeTask (http://localhost:13244/node_modules/zone.js/dist/zone.js:367:31)
    at Zone.runTask (http://localhost:13244/node_modules/zone.js/dist/zone.js:166:47)
    at drainMicroTaskQueue (http://localhost:13244/node_modules/zone.js/dist/zone.js:546:35)"

1 个答案:

答案 0 :(得分:1)

项目github网站上的例子有点奇怪。在使用该库之前,您必须在app.module.ts文件中导入该模块。

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

import { Ng4GeoautocompleteModule } from 'ng4-geoautocomplete';

@NgModule({
  declarations: [ your declarations ],
  imports: [
    BrowserModule,
    Ng4GeoautocompleteModule
  ],  
  bootstrap: [AppComponent]
})
export class AppModule { }

从那以后,您应该能够使用库组件。