從Angular2組件將對象作為參數傳遞時，未調用外部HTML文件中的JavaScript函數

Question

我正在將Angular2用於移動應用程序，並且必須使用內置的cordova插件（InAppBrowser）之一在新窗口中打開URL。 為了檢測新窗口的頁面加載完成的事件，有一個EventListener“ loadstop”，如下所示。 這是來自我應用內的組件

var options = {url: "mylink", fileName: "myfilename"};    
let browser = new InAppBrowser('http://www.myexamplesite.com', '_blank', 'location=no');
browser.on("loadstop")
      .subscribe(
      () => {
        browser.executeScript(
          {
            code: "getOptions("+options+");"
          });
      },
      err => {
        console.log("Loadstop Event Error: " + err);
      });

外部URL是帶有一些JavaScript代碼的HTML文件。 getOptions（options）是一個在此定義為內聯的JavaScript函數。 這是功能：

function getOptions(options) {
     alert("Values are "+options['url']+" and "+options['name']);
}

但是函數不是以這種方式調用的。 當我從調用和定義中刪除參數選項時，它會起作用。 可能是什么原因？ Angular2和JavaScript中的對象是否不能互操作？

Answer 1

問題是您連接字符串和options 。 您可以使用JSON.stringify獲得可以連接的內容。

問題說明：

var options = {url: "mylink", fileName: "myfilename"};   


// This is what you do:
console.log("getOptions("+options+");");

// This is what you should do:
console.log("getOptions(" + JSON.stringify(options) + ");");

//
// This shows it works: `getOptions` will be called.
//
function getOptions(options) {
    console.log("OPTIONS: ", options);
    console.log("Values are "+options['url']+" and "+options['fileName']);    
}

eval("getOptions(" + JSON.stringify(options) + ");");

如果運行上面的命令，則會在控制台上獲得此命令：

getOptions([object Object]);
getOptions({"url":"mylink","fileName":"myfilename"});
OPTIONS:  { url: 'mylink', fileName: 'myfilename' }
Values are mylink and myfilename