What does the `$scope.$ctrl .xxxx` does?

Question

really strange question, I know, but I have no idea what that code does. In one repo, I see this code:

$scope.$ctrl.browseData({ dataParameters: newValue });

Forget the second part. Everything inside the Parenthesis is a Data Source. My Question is, what is $scope.$ctrl. does?

I have no idea. I don not even know where to look or how to search for it. If I remove it and put just the ctrl......, my bug goes away, but I am not sure since this is kind of ancient functionality.

I am using AngularJS. Can someone explain to me what this code $scope.$ctrl does? Thank you!!

Is this some component? This should be a controller, depends on `controllerAs` value. — barbsan, Sep 04 '19 at 11:41
It accesses the `$ctrl` property of the `$scope` object. Presumably that would be some instance of a controller that is attached to the scope. What that scope is exactly or what controller it is we don't know. — deceze, Sep 04 '19 at 11:42
Possible duplicate. Have a look [here](https://stackoverflow.com/questions/52926554/what-are-ctrl-in-angularjs-when-to-use-ctrl-vs-scope-on-view) and [here](https://stackoverflow.com/questions/46663568/how-to-handle-ctrl-in-angularjs) — Rei Mavronicolas, Sep 04 '19 at 11:44
I think your question might be answered by [this post](https://stackoverflow.com/questions/36678099/what-is-the-use-of-a-dollar-sign-in-angularjs). Basically `$ctrl` is the default name of the controller in angularJS. — DaggeJ, Sep 04 '19 at 11:43

score 1 · Answer 1 · answered Sep 04 '19 at 11:55

$scope.$ctrl is a reference to some controller passed as $ctrl in one of the following ways

ng-controller="someCtrl as $ctrl" in template
controllerAs: "$ctrl" in case of directives and components (it's default value for component)

angular.module("app", [])
.controller("someCtrl", function($scope){
  var vm = this;
  vm.sth = "something";
  
  $scope.getSth = function(){
    return $scope.$ctrl.sth;
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app">

  <div ng-controller="someCtrl as $ctrl">
  <div>{{$ctrl.sth}}</div>
  <div ng-bind="getSth()"></div>
  
  </div>
</div>

score 1 · Answer 2 · answered Sep 05 '19 at 03:38

Not worry, has happened to all of us.

In general $ctr refers to controller.

Which brings us the next question: What is the difference between $scope. and controller.?

I notice that you lack practice in this, I recommend that you read the following:

https://docs.angularjs.org/guide/scope

Do not hesitate to ask me any problem!

Have a nice day :D

score 0 · Answer 3 · answered Sep 04 '19 at 11:47

"Scope is a special JavaScript object that connects controller with views. Scope contains model data. In controllers, model data is accessed via $scope object."

Source: https://www.tutorialspoint.com/angularjs/angularjs_scopes.htm

"In AngularJS, a Controller is defined by a JavaScript constructor function that is used to augment the AngularJS Scope.

[...]

Use controllers to:

Set up the initial state of the $scope object. Add behavior to the $scope object. "

Source: https://docs.angularjs.org/guide/controller

Angular creates an $scope object for each controller. There is also a $rootScope object available for all the controllers.

"Scope is an object that refers to the application model. It is an execution context for expressions. Scopes are arranged in hierarchical structure which mimic the DOM structure of the application. Scopes can watch expressions and propagate events."

I recommend this article to understand scopes: https://docs.angularjs.org/guide/scope

What does the `$scope.$ctrl .xxxx` does?

3 Answers3