Question

我试图在我的Angular 4安装上使用angular-google-maps / @ agm / core。

我在组件html文件中有：

<sebm-google-map [latitude]="lat" [longitude]="lng">
  <sebm-google-map-marker [latitude]="lat" [longitude]="lng"></sebm-google-map-marker>
</sebm-google-map>

当我运行它时，我收到错误消息：

Unhandled Promise rejection: Template parse errors:
Can't bind to 'latitude' since it isn't a known property of 'sebm-google-map'.
1. If 'sebm-google-map' is an Angular component and it has 'latitude' input, then verify that it is part of this module.
2. If 'sebm-google-map' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<sebm-google-map [ERROR ->][latitude]="lat" [longitude]="lng">
  <sebm-google-map-marker [latitude]="lat" [longitude]="lng"></se"): ng:///AppModule/GoogleMapsComponent.html@0:17

Answer 1

我发现了错误，我想与您分享我的解决方案。

要获得现在称为@ agm / core的angular2-google-map，更新选择器标记非常重要。作者尚未更新文档（在帖子的这个时刻）。

在上次更新之前：

npm install angular2-google-maps --save

<sebm-google-map [latitude]="lat" [longitude]="lng">
  <sebm-google-map-marker [latitude]="lat" [longitude]="lng"></sebm-google-map-marker>
</sebm-google-map>

最新更新后的

npm install @ agm / core --save

<sebm-google-map [latitude]="lat" [longitude]="lng">
  <sebm-google-map-marker [latitude]="lat" [longitude]="lng"></sebm-google-map-marker>
</sebm-google-map>

示例设置：

file：google-maps.component.ts

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

@Component({
  selector: 'app-google-maps',
  templateUrl: './google-maps.component.html',
  styleUrls: ['./google-maps.component.css'],
})

export class GoogleMapsComponent implements OnInit {
  lat: number = 51.678418;
  lng: number = 7.809007;

constructor() { }

  ngOnInit() {
  }

}

file：google-maps.component.html

<agm-map [latitude]="lat" [longitude]="lng">
  <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
</agm-map>

file：google-maps.component.css

.sebm-google-map-container {
  height: 300px;
}

file：app.module.ts

import { AgmCoreModule } from '@agm/core';
@NgModule({imports: [AgmCoreModule.forRoot()}]]

Answer 2

插件创始人塞巴斯蒂安现已更新文档，您可以找到说明here。我之前的回答仍然有效，但您可能会在他的网站上找到更详细的答案。

为什么我会收到此错误：无法绑定到＆＃39;纬度＆＃39;因为它不是sebm-google-map＆＃39;的已知属性。在Angular 4中添加选择器标签时？

2 个答案: