如何在 Zeppelin 上从 JavaScript 设置角度变量值

Posted 2023-03-23

【中文标题】如何在 Zeppelin 上从 JavaScript 设置角度变量值

【英文标题】：How to set angular variable value from JavaScript on Zeppelin

【发布时间】：2017-05-06 02:29:10

【问题描述】：

我在 zeppelin 上使用 D3 进行可视化，我需要将 Scala 变量与 javascript 变量链接起来。

简单来说，我有以下三段：

1)

z.angularUnbind("aux")
z.angularBind("aux", "original value")

2)

%angular
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>

<script>
function myFunction() 
    if (document.getElementById("demo").innerhtml === "")
       document.getElementById("demo").innerHTML = "Hello World";
       aux = "If"
    else
        document.getElementById("demo").innerHTML = "";
        aux = "Else"
    

</script>

3)

z.angular("aux")

我希望得到以下结果：

在点击“点击我”按钮之前，我希望： aux = “原始值”。

单击“点击我”按钮后，我希望： aux = "If"

点击两次“点击我”按钮后，我希望： aux = “Else”

如何将javascript“aux”变量与angular的“aux”链接？

【问题讨论】：

再解释一下，aux 变量是在哪里定义的？在Scope?

我不知道我必须在哪里定义它。我需要从 Angular 中的 Javascript 获取信息。之后我想在其他段落中定义一个角度控制器来响应aux 的变化。

查看***.com/questions/38335170/…

谢谢@RockieYang，我终于可以解决我的问题了。

【参考方案1】：

我终于找到了方法：

第 1) 和 3) 段与所讨论的内容相同。进入 pragraph 2) 通过在 angularjs 输入字段中写入并使用 z.angularBind(..) 方法对更改做出反应来修改 aux 变量。它允许将辅助变量与另一个值绑定。 z.angularBind(..) 方法的第三个参数是第 3 段的标识符。

2)

%angular
<button onclick="myFunction()">Click me</button>
<input id="tb" class="hide"  ng-model="aux" ng-change="z.angularBind('aux',aux,'20161224-171923_464920272')"></input>
<p id="demo"></p>

<script>
function myFunction() 
    var element = $('#tb');
    if (document.getElementById("demo").innerHTML === "")
       document.getElementById("demo").innerHTML = "Hello World";
       element.val("If");
    else
        document.getElementById("demo").innerHTML = "";
        element.val("Else");
    
    window.setTimeout(function() 
        return element.trigger('input');
    , 500);

</script>