在ng-click上调用范围之外的javascript函数

Question

我有一个javascript库,其中包含许多有用的功能,我可以在我的网站上使用它来执行各种操作.

我知道我无法通过ng-click访问这些函数,因为这些函数超出了范围.

有没有办法访问它们而不必声明只调用库中函数的作用域函数？

这是一个带示例的jsfiddle.我想知道是否有办法使第二个链接工作.这只是因为我不喜欢定义一个简单地调用另一个函数的函数的想法.例如

HTML:

<div ng-click="doSomething()">Click Me (Working)</div>
<div ng-click="doSomethingElse()">Click Me (Not Working)</div>

控制器JS:

$scope.doSomething = function () {
    doSomethingElse();
};

外部库JS:

function doSomethingElse() {
    alert("SomethingElse");
}

<------- ------- UPDATE>

感谢您的创意回应!Vinay K的答案是最容易和最明显的,但我决定采用Ron E的答案.原因是我已经拥有一个带有可重用指令集合的全局模块,这将使我在HTML中实现更容易和更清晰.另外因为我有时会从库中使用多个函数,然后必须在onclick中链接它们:

onlick="func1(); func2(); func3();"

指令只是更清洁,我可以在做其他事情时调用尽可能多的函数.

Answer 1

ng-click 表达式(或角度中的任何其他表达式)将在范围的上下文中进行评估.

由于doSomethingElse未在范围上定义,因此无效.

用onclick而不是ng-click

<div ng-click="doSomething()">Click Me</div>
<div onclick="doSomethingElse()">Click Me </div>

Answer 2

你可以使用一个指令,这是一个例子:

// in your JS source
angular.directive('something', [function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            element.bind('click', function() {
                alert('yup');
            });
        }
    };
}]);

// in your HTML file
<button type="button" something>Click Me!</button>

这使您可以非常轻松地在整个项目中重用各种代码块/函数.