In AngularJS, a scope is an object that refers to the application model. It is an execution context for expressions.

learn more… | top users | synonyms

828
votes
6answers
213k views

'this' vs $scope in AngularJS controllers

In the "Create Components" section of AngularJS's homepage, there is this example: controller: function($scope, $element) { var panes = $scope.panes = []; $scope.select = function(pane) { ...
882
votes
13answers
424k views

What is the difference between '@' and '=' in directive scope in AngularJS?

I've read the AngularJS documentation on the topic carefully, and then fiddled around with a directive. Here's the fiddle. And here are some relevant snippets: From the HTML: <pane bi-title="...
833
votes
7answers
656k views

How do I use $scope.$watch and $scope.$apply in AngularJS?

I don't understand how to use $scope.$watch and $scope.$apply. The official documentation isn't helpful. What I don't understand specifically: Are they connected to the DOM? How can I update DOM ...
666
votes
22answers
323k views

AngularJS : Prevent error $digest already in progress when calling $scope.$apply()

I'm finding that I need to update the my page to my scope manually more and more since building an application in angular. The only way I know of to do this is to call $apply() from the scope of my ...
109
votes
11answers
94k views

Controller not a function, got undefined, while defining controllers globally

I am writing a sample application using angularjs. i got an error mentioned below on chrome browser. Error is Error: [ng:areq] http://errors.angularjs.org/1.3.0-beta.17/ng/areq?p0=...
60
votes
5answers
71k views

How do I share $scope data between states in angularjs ui-router?

Without using a service or constructing watchers in the parent controller, how would one give children states access to the main controller's $scope. .state("main", { controller:'...
11
votes
3answers
25k views

Angularjs Uncaught Error: [$injector:modulerr]

I am learning Angular.js and I am not able to figure out whats wrong with this simple code. It seems to look fine but giving me following error. **Error**: Uncaught Error: [$injector:modulerr] http://...
297
votes
7answers
341k views

AngularJS access parent scope from child controller

I've set up my controllers using data-ng-controller="xyzController as vm" I have a scenario with parent / child nested controllers. I have no problem accessing parent properties in the nested html by ...
913
votes
14answers
382k views

How do I access the $scope variable in browser's console using AngularJS?

I would like to access my $scope variable in Chrome's JavaScript console. How do I do that? I can neither see $scope nor the name of my module myapp in the console as variables.
18
votes
1answer
11k views

If you are not using a .(dot) in your AngularJS models you are doing it wrong?

I remember seeing this famous quote from a video on AngularJS saying that should be always using a . (dot) in your models. Well I am trying to follow this say I have var item = {} item.title =...
157
votes
4answers
92k views

AngularJS - losing scope when using ng-include

I have this module routes: var mainModule = angular.module('lpConnect', []). config(['$routeProvider', function ($routeProvider) { $routeProvider. when('/home', {template:'views/home....
253
votes
5answers
37k views

When writing a directive in AngularJS, how do I decide if I need no new scope, a new child scope, or a new isolated scope?

I'm looking for some guidelines that one can use to help determine which type of scope to use when writing a new directive. Ideally, I'd like something similar to a flowchart that walks me through a ...
82
votes
7answers
108k views

How do I inject a controller into another controller in AngularJS

I'm new to Angular and trying to figure out how to do things... Using AngularJS, how can I inject a controller to be used within another controller? I have the following snippet: var app = angular....
257
votes
4answers
99k views

$rootScope.$broadcast vs. $scope.$emit

Now that the performance difference between $broadcast and $emit has been eliminated, is there any reason to prefer $scope.$emit to $rootScope.$broadcast? They are different, yes. $emit is ...
183
votes
8answers
277k views

How do I use $rootScope in Angular to store variables?

How do I use $rootScope to store variables in a controller I want to later access in another controller? For example: angular.module('myApp').controller('myCtrl', function($scope) { var a = //...
108
votes
10answers
127k views

AngularJS access scope from outside js function

I'm trying to see if there's a simple way to access the internal scope of a controller through an external javascript function (completely irrelevant to the target controller) I've seen on a couple ...
115
votes
1answer
37k views

How to do two-way filtering in angular.js?

One of the interesting things Angular.js can do is apply a filter to a particular databinding expression, which is a convenient way to apply, for example, culture-specific currency or date formatting ...
96
votes
12answers
106k views

Sending event when angular.js finished loading

Wondered what's the best way to detect the finish of page loading/bootstrapping, when all directives done compiling/linking. Any event already there? Should i overload the bootstrap function?
24
votes
2answers
12k views

Does my ng-model really need to have a dot to avoid child $scope problems?

According to https://github.com/angular/angular.js/wiki/Understanding-Scopes, it's a problem to try to data-bind to primitives attached to your $scope: Scope inheritance is normally straightforward,...
51
votes
3answers
18k views

Confused about Angularjs transcluded and isolate scopes & bindings

I am struggling to understand the scope of models and their bindings in respect of directives which have limited scope. I get that restricting the scope on a directive means that controller.$scope ...
164
votes
5answers
170k views

How to set the id attribute of a HTML element dynamically with angular js?

Provided an HTML element of type div, how to set the value of its id attribute, which is the concatenation of a scope variable and a string ?
260
votes
7answers
120k views

$watch an object

I want to watch for changes in a dictionary, but for some reason watch callback is not called. Here is a controller that I use: function MyController($scope) { $scope.form = { name: 'my ...
5
votes
2answers
2k views

ion-content and ion-footer have different $scope

I have two input fields inside my ion-content and they both have an ng-model attached to them. Then inside my ion-footer I have an ng-click where I call a function and pass in the two ng-models. ...
20
votes
3answers
27k views

Angularjs: call other scope which in iframe

In my test, given 2 document, A and B. In A document, there is an iframe, the iframe source is B document. My question is how to modify B document certain scope of variable? Here is my code: A ...
8
votes
2answers
4k views

AngularJS : $q -> deferred API order of things (lifecycle) AND who invokes digest?

The $q service is very powerful in angularjs and make our life easier with asynchronous code. I am new to angular but using deferred API is not very new to me. I must say that I completely ok with ...
83
votes
2answers
49k views

Directive isolate scope with ng-repeat scope in AngularJS

I have a directive with an isolate-scope (so that I can reuse the directive in other places), and when I use this directive with an ng-repeat, it fails to work. I have read all the documentation and ...
138
votes
5answers
44k views

How do I ignore the initial load when watching model changes in AngularJS?

I have a web page that serves as the editor for a single entity, which sits as a deep graph in the $scope.fieldcontainer property. After I get a response from my REST API (via $resource), I add a ...
74
votes
6answers
40k views

Why is using if(!$scope.$$phase) $scope.$apply() an anti-pattern?

Sometimes I need to use $scope.$apply in my code and sometimes it throws a "digest already in progress" error. So I started to find a way around this and found this question: AngularJS : Prevent error ...
95
votes
4answers
137k views

AngularJS: ng-repeat list is not updated when a model element is spliced from the model array

I have two controllers and share data between them with an app.factory function. The first controller adds a widget in the model array (pluginsDisplayed) when a link is clicked. The widget is pushed ...
24
votes
5answers
41k views

AngularJS : ng-repeat filter when value is greater than

I have a simple ng-repeat that throws out data, one of fields it displays is NumberOfStamps: <tr ng-repeat-start="list in Data.Items "> <td><a href=" {[{list.Title}]} {[{list....
20
votes
2answers
13k views

Rendering directives within $sce.trustAsHtml

I've included a Plunker here: http://plnkr.co/edit/4vqV8toHo0vNjtfICtzI?p=preview I'm trying to add a button to the DOM and when clicked should execute the function bound to it. In this case it ...
23
votes
3answers
16k views

Angular scope function executed multiple times

I have defined a function on scope. And when I call it from the view inside {{}} it executes X number of times. Controller function testCtrl($scope) { $scope.myFunc = function(name) { ...
0
votes
4answers
3k views

angularjs share data config between controllers

I'm wondering what could be a good way to share directive between controller. I've got ie two directives to use in different controller with different configuration the first think I thought of using ...
120
votes
9answers
38k views

Angularjs: 'controller as syntax' and $watch

How to subscribe on property change when using controller as syntax? controller('TestCtrl', function ($scope) { this.name = 'Max'; this.changeName = function () { this.name = new Date(); } ...
40
votes
4answers
19k views

AngularJs 1.5 - Component does not support Watchers, what is the work around?

I've been upgrading my custom directives to the new component method.I've read that component's does not support watchers. Is this correct? If so how do you detect changes on an object. For a basic ...
73
votes
4answers
50k views

angularJS: How to call child scope function in parent scope

How can call a method defined in child scope from its parent scope? function ParentCntl() { // I want to call the $scope.get here } function ChildCntl($scope) { $scope.get = function() { ...
23
votes
2answers
46k views

How to modify scope from within a directive in AngularJs

I need to modify a root scope attribute from within a callback inside a directive. But the directive is in a inner scope created by a switch directive. HTML <div ng-app="app" ng-controller='...
15
votes
5answers
17k views

Dynamic form name attribute <input type=“text” name=“{{ variable-name }}” /> in Angularjs

How would someone use formName.inputName.$valid when the "inputName" was dynamically created? <form name="formName"> <input ng-repeat="(variable) in variables" type="text" ...
88
votes
4answers
83k views

Call a controller function from a directive without isolated scope in AngularJS

I cannot seem to find a way to call a function on the parent scope from within a directive without using isolated scope. I know that if I use isolated scope I can just use "&" in the isolated to ...
98
votes
5answers
56k views

Update parent scope variable

I have two controllers one wrapped within another. Now I know the child scope inherits properties from the parent scope but is there a way to update the parent scope variable? So far I have not come ...
28
votes
6answers
27k views

Anyway to trigger a method when Angular is done adding scope updates to the DOM?

I am looking for a way to execute code when after I add changes to a $scope variable, in this case $scope.results. I need to do this in order to call some legacy code that requires the items to be in ...
78
votes
10answers
183k views

Get value when selected ng-option changes

I have in my .html page a dropdown list, Dropdown: <select ng-model="blisterPackTemplateSelected" data-ng-options="blisterPackTemplate as blisterPackTemplate.name for blisterPackTemplate in ...
24
votes
3answers
46k views

AngularJS: open a new browser window, yet still retain scope and controller, and services

I'm writing an angularJS app. In this particular controller, I open a new browser window through the $window.open service. But in the new window, all the $scope variables are lost. I tried to use ...
73
votes
14answers
165k views

Confirmation dialog on ng-click - AngularJS

I am trying to setup a confirmation dialog on an ng-click using a custom angularjs directive: app.directive('ngConfirmClick', [ function(){ return { priority: 1, ...
2
votes
2answers
963 views

Model in a modal window in angularjs is empty

Hello I am using angularjs ui bootstrap and I have one text field in a modal window, which when I try to print it in alert window it is empty. Any reasons why? Here is a plunker of the code.
117
votes
4answers
85k views

Can an angular directive pass arguments to functions in expressions specified in the directive's attributes?

I have a form directive that uses a specified callback attribute with an isolate scope: scope: { callback: '&' } It sits inside an ng-repeat so the expression I pass in includes the id of the ...
54
votes
4answers
94k views

AngularJS event on window innerWidth size change

I'm looking for a way to watch changes on window inner width size change. I tried the following and it didn't work: $scope.$watch('window.innerWidth', function() { console.log(window.innerWidth);...
41
votes
3answers
96k views

Call a method of a controller from another controller using 'scope' in AngularJS

I am trying to call a method of second controller in first controller by using scope variable. This is a method in my first controller: $scope.initRestId = function(){ var catapp = document....
39
votes
6answers
83k views

How to call a function from another controller in angularjs? [duplicate]

I need to call function in another controller in angular js.How it is possible way please help me thanks in advance Code : app.controller('One', ['$scope', function($scope) { $scope....
28
votes
6answers
32k views

AngularJS controller inheritance

AngularJS has a DOM based controller inheritance, as mentioned in the angular Docs. <div ng-controller="BaseController"> <p>Base Controller Value: {{value}}</p> <button ...