scala 如何在 Zeppelin 的 javascript 中将变量放入 z ZeppelinContext 中？

How to put a variable into z ZeppelinContext in javascript in Zeppelin?

提问by samthebest

In Scala and Python it's:

在 Scala 和 Python 中，它是：

z.put("varname", variable)

But in javascript I get (in the console)

但是在javascript中我得到（在控制台中）

Uncaught ReferenceError: z is not defined

What I really want to do is access a javascript variable from Scala code using z.angular("varname")in Zeppelin, but I'm having no luck :(

我真正想做的是从z.angular("varname")Zeppelin 中使用的 Scala 代码访问 javascript 变量，但我没有运气:(

In full need in one cell something like

在一个单元格中完全需要类似的东西

%angular
<script>
var myVar = "hello world";

// some magic code here!
</script>

Then in another cell

然后在另一个单元格中

println(z.angular("myVar"))

UPDATE:

更新：

This is what I have so far, I'm completely stabbing in the dark, since I'm more of a back end / data science kind of guy. So apologies in advance for my front end hopelessness.

这就是我到目前为止所拥有的，我完全在黑暗中刺伤，因为我更像是一个后端/数据科学类的人。所以提前为我的前端绝望道歉。

Cell 1:

单元格 1：

z.angularBind("myVar", "myVar")
z.angularBind("msg", "msg")

Note I have no idea what to put in the second argument.

注意我不知道在第二个参数中放什么。

Cell 2:

单元格 2：

%angular

<div ng-app>
    <div id="outer" ng-controller="MsgCtrl">
        You are {{msg}}
    </div>
    <div onclick="change()">click me</div>
</div>

<script>
var myVar = "hello world";

function MsgCtrl($scope) 
{
    $scope.msg = "foo";
    // also experimented with $scope.msg = myVar;
}

function change() {
    var scope = angular.element($("#outer")).scope();
    scope.$apply(function(){
        scope.msg = 'Superhero';
    })
}
</script>

Cell 3:

单元格 3：

z.angular("msg")
z.angular("myVar")

And no matter what I do I just either get nullor the var name.

无论我做什么，我都只是得到null或 var 名称。

I don't see a button either or anything to "click".

我没有看到按钮或任何可以“单击”的东西。

回答by Rockie Yang

In Angular interpreter. we can

在 Angular 解释器中。我们可以

• Use within html content

  {{name}}

• Bind with

  ng-model='name'

• Use or set with ng-click or other angular directives.

  ng-click="name='Rockie'"

• 在 html 内容中使用

  {{name}}

• 绑定

  ng-model='name'

• 使用或设置 ng-click 或其他角度指令。

  ng-click="name='Rockie'"

Modify scope variable outside of angular's controller is not a good practise according to many SOs. I also have not make it work in Zeppelin. There is a normal js fiddle examplethough.

根据许多 SO，在 angular 控制器之外修改范围变量不是一个好习惯。我也没有让它在 Zeppelin 中工作。不过有一个普通的 js 小提琴示例。

And in Spark interpreter. We can

并在 Spark 解释器中。我们可以

• Bind with

  z.angularBind("name", "Knock Data")

• Unbind with

  z.angularUnbind("name")

• Get the value with, the variable need be bind first, otherwise it will get null.

  z.angular("name")

• Watch a variable with

  z.angularWatch("name", (oldValue: Object, newValue: Object) => { println(s"value changed from $oldValue to $newValue" })

• 绑定

  z.angularBind("name", "Knock Data")

• 解除绑定

  z.angularUnbind("name")

• 取值时，需要先绑定变量，否则为空。

  z.angular("name")

• 观察一个变量

  z.angularWatch("name", (oldValue: Object, newValue: Object) => { println(s"value changed from $oldValue to $newValue" })

Beside the angular bind. The Dynamic Formis a good way to give interactive for end users

在角度绑定旁边。该动态表单是给最终用户互动的好方法

• Input

  z.input("number", 1).toString.toInt

• Select without default value

  z.select("Day", Seq(("1", "Mon"), ("2", "Tue")))

• Select with default value,

  z.select("Day", "1", Seq(("1", "Mon"), ("2", "Tue")))

• Check

  z.checkbox("good applications", Seq(("1", "Zeppelin"), ("2", "Highcharts"), ("3", "Spark")))

• 输入

  z.input("number", 1).toString.toInt

• 选择无默认值

  z.select("Day", Seq(("1", "Mon"), ("2", "Tue")))

• 选择默认值，

  z.select("Day", "1", Seq(("1", "Mon"), ("2", "Tue")))

• 查看

  z.checkbox("good applications", Seq(("1", "Zeppelin"), ("2", "Highcharts"), ("3", "Spark")))

回答by la_femme_it

this worked for me

这对我有用

%angular

%角

<div id="map" style="height: 300px; width: 50%" ng-model="id_selected_arr"/>

%spark2

%spark2

var result = z.angular("id_selected_arr")

But I gace another issue, how to process the array... Maybe someone will answer to you and it moght help to you as well Check it here

但我面临另一个问题，如何处理数组...也许有人会回答你，它也可能对你有帮助，请在此处查看