在从HTML代码调用的JavaScript函数中使用$ scope变量-AngularJS

Question

我正在使用Angular，并且试图让$ scope在JavaScript函数中使用它。 这是一个例子：

我有一个类似这样的html标签：

<a id="doSomething" onclick="javascript: doSomething(this);">Do Something</a>
<div ng-show="flag">Click!</div>

和JavaScript函数，如下所示：

function doSomething(obj) {
    //$scope.flag = true;
    return true;
}

我想要的是在此函数中使用$ scope。 我还没有找到注入它的方法。 问题是我必须使用这种方式来调用函数。 您对此有什么解决方案吗？ 我会很感激！

谢谢！

Answer 1

如果您真的必须..请按以下步骤操作：

HTML：

<a onclick="doThing(this);">Do it!</a>

JS：

function doThing(el) {
  var $scope = angular.element(el).scope();
  $scope.thing = newVal;
  $scope.$apply(); //tell angular to check dirty bindings again
}

请务必阅读有关angular.element的文档： http ://docs.angularjs.org/api/angular.element以及scope。$ apply： http ://docs.angularjs.org/api/ng。$ rootScope。范围＃$适用

但是，您的用例是什么？ 可能有更好的方法。

Answer 2

您也可以内联：

JS：

$scope.doThis = function(str){
     alert(str);
     $scope.$apply();
}

HTML：

<button onclick="angular.element(this).scope().doThis('TEST');"></button>

注意-范围嵌套可能会影响结果，但是如果角度代码在父级控制下，则可以很好地解决问题

Answer 3

这与@Andy的答案相同，但在人们希望了解如何从事件中获取$ scope而不是this情况下，我会提及它：

HTML：

<a onclick="doThing(event);">Do it!</a>

JS：

function doThing(ev) {
  var $scope = angular.element(ev.srcElement).scope();          
  $scope.flag = true;
  $scope.$apply(); //tell angular to check dirty bindings again
}

Answer 4

您应该为此调用angular ng-click，然后从那里传递范围。

这是我为您创建的示例。 http://plnkr.co/edit/UDLJYuZhR4yfiocSPjKJ

如果可以解决问题，请将其标记为答案。