首页 > 解决方案 > Blazor 一些 Javascript 运行,一些不运行

问题描述

我是 Web 编码新手,对 Javascript 或 Blazor 没有太多经验。

我正在使用这个名为 PictometryHost 的 API,它通过 Javascript 将开销正射图像带入 Iframe。

我制作了一个 Javascript 文件并将其链接到我的 _host.cshtml 中。代码如下所示:

var ipa = new PictometryHost('pictometry_ipa', 'http://website.com'); <----This works
ipa.ready = function () {
                                   <-----This does not appear to run
}
ipa.getLayers(function (result) {

    // Do something with the list of layers  <-----This does not appear to run
    // We can save them to reference later when we need to show or hide them.
    myLayers = result.layers;

});
ipa.getSearchServices(function (searchableLayers) {
                                                                        <-----This does not appear to run
    mySearchLayers = searchableLayers;
    for (j = 0; j < mySearchLayers.textSearchServices.length; j++) {
        if (mySearchLayers.textSearchServices[j].description == "Parcels") {
            var layerId = mySearchLayers.textSearchServices[j].id;
            for (i = 0; i < mySearchLayers.textSearchServices[j].fields.length; i++) {
                if (mySearchLayers.textSearchServices[j].fields[i].key == "mcontrolnumn") {
                    var fieldsKey = mySearchLayers.textSearchServices[j].fields[i].key; var query = {
                        searchString: "01059201",//PPN.value,
                        id: layerId,
                        fields: [fieldsKey]
                    };
                    ipa.searchByString(query);
                }
            }
        }
    }
});
ipa.setLocation({
    y: 43.152139,       // Latitude                         <-----This does not appear to run
    x: -77.580298,      // Longitude
    zoom: 20            // Optional Zoom level
});

function setIframeAttribute(iFrame, urlSig) {

    var iframe = document.getElementById(iFrame);  <-----This runs called from index page with jsinterop
    iframe.setAttribute('src', urlSig);


}

我可以初始化 Pictometry 主机,如果我在 chrome 中执行 dir(window),我可以看到它,我可以看到 ipa 变量。

但是,当我尝试使用句柄执行它时,据我所知,它的方法似乎没有运行。

例如,如果我要尝试插入说 console.log("Is this thing on?"); 在这些 ipa 方法中的任何地方,我都没有在 chrome 浏览器中获得控制台输出。如果我创建一个全局变量 var HasItRun = "No"; 然后在任何方法中更改 HasItRun = "Yes"; HasItRun 在运行时始终为 No。

我确信有一些非常基本的东西我不明白。如果有人能指出我正确的方向,那就太棒了!

标签: javascriptblazor

解决方案


我不确定这是否对任何人都有帮助。我不得不将 ipa 方法嵌套在 ipa.ready 函数中。他们在 ipa.ready 括号之外,所以他们只是没有执行。

我也只是从 onafterasync 任务事件中运行了我的整个 javascript 文件,而不是在我的 host.cshtml 文件中链接它并让它以这种方式运行。

现在我的 Javascript 文件看起来像这样。

function setIframeAttribute(iFrame, urlSig, ipaLoadURL) {

    var ipa = new PictometryHost(iFrame, ipaLoadURL);

    ipa.ready = function () {
        
        ipa.addListener('location', function (lat, lon) {
            alert(lat + " : " + lon);
        });
        ipa.getLayers(function (result) {

            // Do something with the list of layers  <-----This does not appear to run
            // We can save them to reference later when we need to show or hide them.
            myLayers = result.layers;
            // Run the following to turn on the layers that were on when getLayers was called:

            // If there are some layers...
            if (myLayers.length > 0) {

                // Go through each layer
                for (var i = 0; i < myLayers.length; i++) {

                    // For each layer, determine if it was visible when this was saved,
                    // and if it was turn the layer on.
                    var layerState = myLayers[i];

                    // Layer was visible, turn it on
                    if (layerState.visible === true) {
                        ipa.showLayer({
                            id: layerState.id
                        });
                    }
                }
            }
        });
       
        ipa.getSearchServices(function (searchableLayers) {
            mySearchLayers = searchableLayers;
            console.log(mySearchLayers);
            for (j = 0; j < mySearchLayers.textSearchServices.length; j++) {
                if (mySearchLayers.textSearchServices[j].description == "Parcels") {
                    var layerId = mySearchLayers.textSearchServices[j].id;
                    for (i = 0; i < mySearchLayers.textSearchServices[j].fields.length; i++) {
                        if (mySearchLayers.textSearchServices[j].fields[i].key == "mcontrolnumn") {
                            var fieldsKey = mySearchLayers.textSearchServices[j].fields[i].key; var query = {
                                searchString: "01059201",//PPN.value,
                                id: layerId,
                                fields: [fieldsKey]
                            };
                            ipa.searchByString(query);
                        }
                    }
                }
            }
        });
    };

    

    var iframe = document.getElementById(iFrame);
    iframe.setAttribute('src', urlSig);


}

推荐阅读