访问视图中的AngularJS变量？

Question

考虑只有一个控制器的基本AngularJS应用程序。 在控制器内部，我设置了“ myVariable”以保存值“ Test”。

我在视图中获得了内联JavaScript代码，我需要调用一个函数samplefunction ，该函数使用myVariable接受参数。

/* Controllers */

angular.module('myApp.controllers', [])
    .controller('MainCtrl', ['$scope', function($scope) {

        $scope.myVariable = "Test";

    });

在视图中，在html文件中，这是我需要做的：

<script type="text/javascript">

    var param1 = {{myVariable}};   /* <-- how to make this work?  */
    samplefunction( param1 );   

</script>

虽然不行。 我只需要将myVariable值分配给param1 。 我也尝试过类似的方法：

...
var param1 = angular.element(document.getElementById("mainBody")).scope().myVariable
...

但这也不起作用。 请注意，我无法触摸视图中调用的给定JS代码。

有谁知道如何解决这个简单的问题？

Answer 1

从我的观点来看，您不应做的事情。 最接近的正确方法应该是：

使用您应该使用的角度值来设置视图 ：

<input type="text" ng-model="myVariable" id="myVar" />

如果您想要获取var值，请从如下视图中获取它：

<script type="text/javascript">  
    var param1 = document.getElementById("myVal").value;
    samplefunction( param1 );   
</script>

在线演示

Answer 2

将var传递给$ window以将其公开给您的JS。

$window.myVariable = $scope.myVariable;

Answer 3

将范围变量绑定到视图中元素上的data-something属性，然后在外部脚本标签中使用Jquery将其拉出，该怎么办？

<script type="text/javascript">  
    var param1 = $("#someId").data("myValue");
    samplefunction( param1 );   
</script>