0

I've recently gone into developing with AngularJS. It's confusing to me the different between these two: 

$scope.myScope = function () { 
 var x = 'do something with variable here';
 $scope.anotherScope = x;
};

and 

function myFunction () {
 var x = 'do something with variable here';
 $scope.anotherScope = x;
}

They both seem to be able to do the same thing (I use them a lot inside controllers). Is there a best practice for when and where to use these two?

floatyourboat
  • 83
  • 2
  • 9
  • 1
    `$scope.myFunction` should be defined only when you need it on scope i.e. you use it in partial, in any other case regular function is enough – maurycy Feb 16 '15 at 14:35

3 Answers3

2
$scope.myScope = function () {};

This means your function is a property of the scope object. So you can use it in your controller , html page even in your app. it can be referenced in different modules in the same app. so you just call it in your html page using the function name directly either onclick or onchange , anyhow depending on your need.

the other definition can only be used in your controller and is not the scope of your app. however if you define your function using "this.myScope = function(){};" then you can call the function in your html by using your controller. like ng-click = "controllerName.myScope();"

the main difference is i nwhich scope the function belongs to and where all you can reference the function.

hope it helps !!!!

Vaishak P Dinesh
  • 49
  • 8
0

As mourycy already mentioned, you should use the form 

$scope.myScopeFunction = function () { 
    ...
};

only for functions which you want to call via the scope object. This is needed for function calls within your views.

For example: 

<button ng-click="myScopeFunction()" />

which calls the function myScopeFunction of the current $scope object.

If you don't need to be able to call a controller method from "outside" you should use the following form:

function myFunction() { 
    ...
};
boindiil
  • 5,527
  • 1
  • 24
  • 30
  • Ah. So you mean when a function needs to update a view, I use $scope.function. But when the function simply needs to do something on the backend (i.e. do math), I use native Javascript function. Is that about right? This might be a stupid response, but I can still do `ng-click=myFunction()` right? – floatyourboat Feb 16 '15 at 14:46
  • No, this has nothing to do with the goal of the function. If you want to call it from your template (the HTML view), put in scope. Otherwise, left it outside. – Blackhole Feb 16 '15 at 14:54
  • I don't think that you can bind a global function with the ng-click directive. If it should be possible you should definitely _not_ do it. Because you should use the `scope` object as `ViewModel` which is the link between `View` and `Controller`. --> If you want to execute code which is defined in the controller you have to define that code as a function of the scope object – boindiil Feb 16 '15 at 14:58
0
$scope.myScop = function(){
...
};

is a function you can execute from the HTML controller.

function foo(){
...
}

is a function you can only execute on the controller's JS file.

Adlen Gharbi
  • 216
  • 2
  • 11