Question

首先，我有一个如下所示的界面：

@Directive({
  selector: 'sebm-google-map-overlay-view',
  inputs: ['latitude', 'longitude', 'objectId'],
  outputs: ['markerClick', 'dragEnd']
})
export class SebmGoogleMapOverlayView implements OnDestroy,
    OnChanges, AfterContentInit {

  latitude: number;

  longitude: number;

  objectId: string;

我确实得到了Inputs传递的位置，现在我想传递objectId

这里是我需要数据的类：

  createOverlayView(options: mapTypes.MarkerOptions = <mapTypes.MarkerOptions>{}):
    Promise<mapTypes.OverlayView> {
      return this._map.then((map: mapTypes.GoogleMap) => {
         console.log('options');
         var overlay = new mapTypes.OverlayViewBla(options, google);
         var overlayView = overlay.getOverlayView();
         overlayView.setMap(map);

         return overlayView;
    }
  );
}

指令google-map-overlay-view.ts：

export class OverlayViewManager {
  addOverlayView(overlayView: SebmGoogleMapOverlayView) {
     console.log(overlayView.idObject,'test'); // where this is undefined
      const overlayViewPromise = this._mapsWrapper.createOverlayView({
      position: {lat: overlayView.latitude, lng: overlayView.longitude},

    });

    this._overlayViews.set(overlayView, overlayViewPromise);
  }

以下是名为google-maps-api-wrapper.ts的文件中的createOverlayView：

<sebm-google-map-overlay-view *ngFor="let location of locations" [latitude]="location.lat" [longitude]="location.lng" [objectId]="location.id"></sebm-google-map-overlay-view>

此处名为overlay-view-manager.ts

的文件中的addOverlayView方法

locations: marker[] = [
{id: '1',  lat: 51.5239935252832,    lng:  5.137663903579778,   content: 'Kids Jungalow (5p)'},
  ]

和objectId需要作为id输入的html模板：

<select id="mySelect">
 <optgroup label="First group" id="firstGrp">
   <option value="One">One</option>
   <option value="Two">Two</option>
</optgroup>
 <optgroup label="Second group" id="secondGrp">
   <option value="Three">Three</option>
   <option value="Six">Six</option>
   <option value="Four">Four</option>
   <option value="Five">Five</option>
 </optgroup>
</select>

和app.component.ts：

<option value="Six">Six</option>

如何传递id，就像我传递lat和long

一样

Answer 1

我不知道你哪里出错了。可能在google-maps-api-wrapper.ts：

createOverlayView(options: mapTypes.MarkerOptions = <mapTypes.MarkerOptions>{}):

应该是OverlayViewOptions而不是MarkerOptions。

此外，我为你创建了plunkr https://plnkr.co/edit/5RhqdjzjKhYzqvjvDj4p?p=preview

希望它有所帮助！

Angular 2如何使用输入将数据从组件传递到服务？

1 个答案: