使用 AMD 动态加载 google.maps 的更简洁的方法是什么？

Question

我想利用谷歌地图加载器回调，如下所示： https://developers.google.com/maps/documentation/javascript/examples/map-simple-async

我有一个使用 AMD 和 Promise 的工作示例。加载和使用 API：

require(["path/to/google-maps-api-v3"], function (api) {
  api.then(function (googleMaps) {
    // consume the api
   });
});

这是我的模块 def，我希望它在完全加载后返回 google.maps 而不是延迟：

define(["dojo/Deferred"], function (Deferred) {
        var d = new Deferred();
        dojoConfig["googleMapsReady"] = function () {
            delete dojoConfig["googleMapsReady"];
            d.resolve(google.maps);
        }
        require(["http://maps.google.com/maps/api/js?v=3&sensor=false&callback=dojoConfig.ipsx.config.googleMapsReady&"]);
        return d;
    });

但解决方案返回一个承诺，而不是完全初始化的 google.maps。我希望它看起来像一个普通的 AMD 模块，但不知道如何。

Answer 1

创建一个 AMD 插件。这是我根据 JanMisker 的示例创建的：

define(function () {
    var cb ="_asyncApiLoaderCallback";
    return {
        load: function (param, req, loadCallback) {
            if (!cb) return;
            dojoConfig[cb] = function () {
                delete dojoConfig[cb];
                cb = null;
                loadCallback(google.maps);
            }
            require([param + "&callback=dojoConfig." + cb]);
        }
    };
});

使用示例：

require(["plugins/async!//maps.google.com/maps/api/js?v=3&sensor=false"]);