Aufruf Javascript-Funktion außerhalb des Bereichs auf NG-Klick

Question

Ich habe eine Javascript-Bibliothek mit einer Reihe von nützlichen Funktionen, die ich über meine Website nutzen, die verschiedene Dinge tut.

Ich weiß, dass ich nicht auf diese Funktionen von einem ng-Klick zugreifen kann, weil die Funktionen außerhalb des Geltungsbereichs sind.

Gibt es eine Möglichkeit, auf sie zuzugreifen, ohne eine Bereichsfunktion deklarieren zu müssen, die die Funktion in der Bibliothek aufruft?

Here ist ein Kinderspiel mit einem Beispiel. Ich würde gerne wissen, ob es einen Weg gibt, den zweiten Link zum Laufen zu bringen. Das ist einfach, weil ich nicht die Idee mag, eine Funktion zu definieren, die einfach eine andere Funktion aufrufen wird. z.B.

HTML:

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

-Controller JS:

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

Externe Bibliothek JS:

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

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

Danke für die kreativen Antworten Jungs! Vinay K's Antwort ist die einfachste und offensichtlichste, aber ich entschied mich für Ron E's Antwort. Der Grund ist, dass ich bereits ein globales Modul mit einer Sammlung von wiederverwendbaren Direktiven habe und das würde es einfacher und sauberer in meinem HTML zu implementieren. manchmal auch, weil ich mehr als eine Funktion aus der Bibliothek verwenden und dann an die Kette sie in der Onclick haben würde:

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

Wo eine Richtlinie nur sauberer und ich kann so viele Funktionen aufrufen, wie Ich mag, während andere Sachen zu tun auch.

Answer 1

Sie könnten eine Richtlinie verwenden, hier ist ein Beispiel:

// 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> 

Auf diese Weise können Sie Ihre verschiedenen Code-Chunks/Funktionen in Ihrem gesamten Projekt ziemlich leicht wieder zu verwenden.

Answer 2

ng-click Ausdruck (oder jeder andere Ausdruck in eckigen) wird im Zusammenhang mit dem Anwendungsbereich ausgewertet.

Da doSomethingElse nicht im Bereich definiert ist, wird es nicht funktionieren.

Verwenden onclick statt ng-click

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

Answer 3

Wenn Ihre Bibliothek ist global verfügbar (zum Beispiel auf dem Fensterobjekt) eine Methode in Ihrem rootScope schreiben könnte, die den Namen der Funktion als Parameter akzeptiert. Garantiert dies ist nicht die orthodoxe Art, Dinge in Angular zu tun, aber es wird die Notwendigkeit beseitigen, all diese zusätzlichen Methoden in all Ihren Bereichen hinzuzufügen. Hier ein ungefähres Beispiel:

In Ihrer App.run-Methode könnte man so etwas hinzufügen:

$rootScope.callWindowMethod = function(methodName, parameter) { 
    if(typeof window[methodName] !== 'function') { 
    console.log('could not find ', methodName, ' function'); 
    return; 
    } 
    return window[methodName](parameter); 
}; 

Dann in Ihrer Ansicht, die Sie so etwas tun könnte:

<button ng-click="$root.callWindowMethod('alert','Hey there!')">Click Me</button> 

Sie könnten sogar ausgefallenere bekommen und in einer beliebigen Anzahl von Parametern an Ihre Funktion übergeben Außerdem muss der Funktionsname Punkte für Methoden enthalten, die in anderen Objekten verschachtelt sind, und diese aufteilen. Dies sollte dir zumindest den Einstieg erleichtern.

Answer 4

Hallo, wenn Sie festgelegt haben Javascript-Funktion, Sie alte js Funktionen und Angular js zusammen

Beispiel verwenden können:

<div ng-click="doSomething()" class="myBtn"=>Click Me (Working)</div> 
//JQuery Lib must be included your project 
$(document).on('click','.btn',function(){ 
    eval($(this).attr('ng-click')); 
}); 
function doSomething(){ 
//Bla Blo Blu Bli 
} 

Dank für das Lesen