此处：Return 在等待状态更改完成然后订阅时可观察到

Question

我很难解决这两个问题，但仍在努力解决。希望有人能帮助我。提前致谢！

1.) 我有一个 map.service 有这个功能。

readKML(file): any {
    const exportUrl = URL.createObjectURL(file);
    const reader = new HERE_MAP.data.kml.Reader(exportUrl);

    // Parse the document
    reader.parse();

    reader.addEventListener('statechange', (evt) => {
      if (evt.state === HERE_MAP.data.AbstractReader.State.READY) {


        return of({
          markers: ['test'],
          lines: ['test]
        });

      }
      if (evt.state === HERE_MAP.data.AbstractReader.State.ERROR) {
        this.message.error('KML parsing error');
         return of(null);
      }
    });
  }

此函数正在 组件中调用 并期望获得 return 数据。

this.map.service.readKML(file)
.subscribe(
  data => {
    console.log(data);
  }
)

问题是我遇到错误

this.map.readKML(...).subscribe is not a function

期望：

如果 stateChange 等于 'READY'，则应该接收到数据。

2.) 该服务将同时调用不同的参数值，如果数字 1 没问题，预计会有不同的 returns。

但是，如果 1 仍然是一个问题，这可以解决。

this.map.service.readKML(file1)
    .subscribe(
      data => {
        console.log('one', data);
      }
    )

this.map.service.readKML(file1)
    .subscribe(
      data => {
        console.log('two', data);
      }
    )

如果你们对如何解决此问题或其他方法有想法，我们将不胜感激。谢谢！

Answer 1

问题：首先你的代码失败的原因： addEventListener 是一个异步操作并且 return 无效，因为当您的函数已经从 readKML 编辑 return 时甚至还没有达到 of。

readKML(file): any {
    const exportUrl = URL.createObjectURL(file);
    const reader = new HERE_MAP.data.kml.Reader(exportUrl);

    // Parse the document
    reader.parse();

// 'addEventListener' is an async operation which returns void, so you are returning a void
    reader.addEventListener('statechange', (evt) => { 
      if (evt.state === HERE_MAP.data.AbstractReader.State.READY) {


        return of({ // reached here after already returning void
          markers: ['test'],
          lines: ['test']
        });

      }
      if (evt.state === HERE_MAP.data.AbstractReader.State.ERROR) {
        this.message.error('KML parsing error');
         return of(null);
      }
    });
  }

修复： 您需要 return 一个可观察对象。因此，将 addEventListener 包装成一个可观察对象。一旦响应到来就完成可观察的。

由于您是 returning observable，每次调用此 readKML 方法时都会创建一个新的 observable。

     readKML(file): any {
    const exportUrl = URL.createObjectURL(file);
    const reader = new HERE_MAP.data.kml.Reader(exportUrl);

    reader.parse();

    return new Observable((subscriber) => { // return observable
        reader.addEventListener('statechange', (evt) => {
            if (evt.state === HERE_MAP.data.AbstractReader.State.READY) {

                subscriber.next({
                    markers: ['test'],
                    lines: ['test']
                }); // return response
                subscriber.complete(); // always complete for next so only single reponse goes for single method call (cold observable)
            }
            if (evt.state === HERE_MAP.data.AbstractReader.State.ERROR) {
                this.message.error('KML parsing error');
                subscriber.next(null); // you can also throw error ` throw throwError(response); `;
                subscriber.complete();
            }
        });
    });
}

此处：Return 在等待状态更改完成然后订阅时可观察到

HERE: Return Observable While Waiting statechange To Finish Then Subscribe To It

javascript

angular

typescript

heremaps