Question

当用户点击地图标记时，我想将数据从一个组件传递到另一个组件。我有两个组件 - 右（显示地图）和左（显示点击标记的标题）。我正在为此目的使用服务。

right component.ts

google.maps.event.addListener(markerarray[i], 'click', ( (marker, i)=> {
   return function () {
       Content = "Name :" + locations[i][0] + '<br> Latitude:' + locations[i][1] + '<br> Longitude:' + locations[i][2];
       infowindow.setContent(Content);
       infowindow.open(map, this);
       this.dataservice.pushData(markerarray[i].title); //This is not working for me
   }      
})(marker, i));

data.service.ts

@Injectable()
export class DataService {
  constructor() { }

  pushdeata=new EventEmitter<string>();
  pushData(value:string) {
    this.pushedata.emit(value);
  }

left.component.ts

declare var google: any;

@Component({
  selector: 'app-left',
  templateUrl: './left.component.html',
  styleUrls: ['./left.component.css']
})
export class LeftComponent implements OnInit {
  value='';

  constructor(private dataservice: DataService) { }

  ngOnInit() {
     this.dataservice.pushdata.subscribe(
        data => this.value = data
     );
  }}

left.component.html

<div>{{value}}<div>

Google map API使用服务Angular2在兄弟组件之间共享数据

0 个答案: