In my view, I want to render:
<p>
{{ say() }}
</p>
Where say
is defined as such:
say = function() {
return "Hello World";
}
I can define it in my controller:
function TestCtrl($scope) {
$scope.say = function() { ... };
}
But then it's only accessible within that controller.
If I define the function outside the Angular file structure, it renders nothing. Same if I define it in my controllers.js
file, but outside a controller function scope.
Where is the proper place to put my function, so I can render it in any controller?
One way is to create a service with the functions you want to share across multiple controllers. See this post for more info.
After you do so you can inject the service you created into any controller and access the
say()
function with code something like this:Where you defined
myService
as:Here is a jsFiddle with an example.