如何在 zeppelin 中将数组从 spark 绑定到 javascript？答案

【问题标题】：How to Bind array from spark to javascript in zeppelin?如何在 zeppelin 中将数组从 spark 绑定到 javascript？
【发布时间】：2019-05-21 05:31:17
【问题描述】：

您好，我正在使用 zeppelin 来可视化一些仪表板，我正在使用 Angularjs 解释器来显示系统以配置 Spark 查询，所以我想在 angularJs 的输入文本框中添加自动完成功能，用于自动完成的列表将首先在 spark 中创建然后我想将它绑定到 zeppelinContext 然后从 angular 获取这个列表作为 javascript 脚本来创建自动完成

这里是一个例子：

第 1 段：

     %spark.pyspark
      cList5 =  df_ClientDataF1.select(col("type")).filter(col("type").isNotNull()).distinct().rdd.map(lambda r: r[0]).collect()
      z.z.angularBind("cList5",cList5)

第 2 段：

   %angular
   <form autocomplete="off">
   <div class="autocomplete" style="width:300px;">
   <input id="myInput" type="text" name="myCountry" placeholder="Country">
   </div>
   <input type="submit">
   </form>
   <script type="text/javascript">
   var element = $('#someId');
   var angularVar = 'cList5';
   var scope = angular.element(element.parent('.ng- scope')).scope().compiledScope;

     function autocomplete(inp, arr) {
    /*the autocomplete function takes two arguments,
   the text field element and an array of possible autocompleted values:*/
    var currentFocus;
 /*execute a function when someone writes in the text field:*/
      .
      .
      .
   /*initiate the autocomplete function on the "myInput" element, and pass along the countries array as possible autocomplete values:*/
     autocomplete(document.getElementById("myInput"), scope);
  </script>

结果变量作用域是一个对象，我试图将它转换为一个数组，但它失败了。问题是如何从 javascript 中的 spark 获取绑定列表作为数组类型。

【问题讨论】：

标签： angularjs autocomplete apache-zeppelin

【解决方案1】：

我正在尝试完全相反的事情：D 但here 是很好的 YT 视频。可能会有所帮助。

【讨论】：

【解决方案2】：

你可以做的是创建一个html element 并隐藏元素的输出。然后，您可以从脚本访问此元素内部 html。我知道这是一个 hack，但我还没有找到更好的方法

%angular

<p id="demo" class="hide">{{cList5}}</p>

<script>
    var angularVar = document.getElementById("demo").innerHTML
    console.log(angularVar)
</script>

您可能需要进行额外的修改。但是例如将 Json 作为字符串传递并在 scipt 中对其进行解析就可以了。

【讨论】：