小编Bru*_*ald的帖子

这很奇怪.它也有点长,所以提前道歉. 更新 - 它最终成为2个问题,请参阅下面的答案.

这是我的错误: EXCEPTION: this.svg.selectAll(...).data(...).enter is not a function

我有一个angular-cli客户端和一个节点api服务器.我可以使用observable从服务中检索states.json文件(下面的代码).d3喜欢该文件并显示预期的美国地图.

当我将api服务器中的服务目标从文件更改为bluemix-cloudant服务器时,我在客户端收到上述错误.

当我使用ngOnInit在一个变体中使用console.log输出时,最初mapData打印为一个空数组,并抛出错误.这是错误的明显来源,因为没有数据,但Chrome调试器显示待处理的请求.请求完成后,数据将按预期在控制台中打印.

• angular-cli版本1.0.0-beta.26
• 角度版本^ 2.3.1
• d3版本^ 4.4.4
• rxjs版本^ 5.0.1

map.component.ts:

import { Component, ElementRef, Input } from '@angular/core';
import * as D3 from 'd3';
import '../rxjs-operators';

import { MapService } from '../map.service';

@Component({
  selector: 'map-component',
  templateUrl: './map.component.html',
  styleUrls: ['./map.component.css']
})
export class MapComponent {

  errorMessage: string;
  height;
  host;
  htmlElement: HTMLElement;
  mapData;
  margin;
  projection;
  path;
  svg;
  width;

  constructor (private _element: ElementRef, private _mapService: MapService) {
    this.host = D3.select(this._element.nativeElement); …