如何从外部AngularJS访问函数

Question

I have absolutely never used AngularJS - I am able to handle all parts of someone else's script - but am lost with a newb idea of accessing the functions outside of the Class? Or whatever it is called 0_o - I have tried to look this up - but I just get lost.

The script Im working on is like this:

app.controller("searchFormController", function($scope,$http){


    $scope.getSomeDetails = function(filter){

        alert("you are doing stuff in this function");

    }


})

The function is typically called from a form outside of the script - like this:

<select id="transmissions" name="transmission" ng-model="transmission" ng-change="getSomeDetails(true)">

When the above form element is selected - the function getSomeDetails is called properly.

Now I simply want to call the same function with a text link instead. I have tried:

<span onClick="getSomeDetails(true)">Get Details </span>

Not sure what I am doing wrong -

I just want to call the same function but using a text link?

Thanks for your help.

Answer 1

app.controller("searchFormController", function($scope,$http){
    $scope.getSomeDetails = function(filter){
        alert("you are doing stuff in this function");
    };
});

Here searchFormController is the your angular function.So attached this function to html template with ng-controller attribute. functions and variable mentioned inside this searchFormController will be available to the template in which you have bind that function with ng-controller .

Your getSomeDetails function is in this searchFormController . So in html template where you wants to call this function before that you needs to bind the controller to it's parent element or to that element so that function scope is available where you needs to call.

Here you have to call function on the click of link so use ng-click . and call the function.

Your span tag should be like this.

<span ng-controller="searchFormController" ng-click="getSomeDetails(true)">Get Details </span>

Answer 2

<span ng-click="getSomeDetails(true)">Get Details</span>