Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <hr> <p><strong>UPDATE</strong></p> <p>Angular offers now the two scope methods <a href="https://docs.angularjs.org/api/ng/type/%24rootScope.Scope#%24watchGroup">$watchGroup</a> (since 1.3) and <a href="https://docs.angularjs.org/api/ng/type/%24rootScope.Scope#%24watchCollection">$watchCollection</a>. Those have been mentioned by @blazemonger and @kargold.</p> <hr> <p>This should work independent of the types and values:</p> <pre><code>$scope.$watch('[age,name]', function () { ... }, true); </code></pre> <p>You have to set the third parameter to true in this case.</p> <p>The string concatenation <code>'age + name'</code> will fail in a case like this:</p> <pre><code>&lt;button ng-init="age=42;name='foo'" ng-click="age=4;name='2foo'"&gt;click&lt;/button&gt; </code></pre> <p>Before the user clicks the button the watched value would be <code>42foo</code> (<code>42</code> + <code>foo</code>) and after the click <code>42foo</code> (<code>4</code> + <code>2foo</code>). So the watch function would not be called. So better use an array expression if you cannot ensure, that such a case will not appear.</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;link href="//cdn.jsdelivr.net/jasmine/1.3.1/jasmine.css" rel="stylesheet" /&gt; &lt;script src="//cdn.jsdelivr.net/jasmine/1.3.1/jasmine.js"&gt;&lt;/script&gt; &lt;script src="//cdn.jsdelivr.net/jasmine/1.3.1/jasmine-html.js"&gt;&lt;/script&gt; &lt;script src="http://code.angularjs.org/1.2.0-rc.2/angular.js"&gt;&lt;/script&gt; &lt;script src="http://code.angularjs.org/1.2.0-rc.2/angular-mocks.js"&gt;&lt;/script&gt; &lt;script&gt; angular.module('demo', []).controller('MainCtrl', function ($scope) { $scope.firstWatchFunctionCounter = 0; $scope.secondWatchFunctionCounter = 0; $scope.$watch('[age, name]', function () { $scope.firstWatchFunctionCounter++; }, true); $scope.$watch('age + name', function () { $scope.secondWatchFunctionCounter++; }); }); describe('Demo module', function () { beforeEach(module('demo')); describe('MainCtrl', function () { it('watch function should increment a counter', inject(function ($controller, $rootScope) { var scope = $rootScope.$new(); scope.age = 42; scope.name = 'foo'; var ctrl = $controller('MainCtrl', { '$scope': scope }); scope.$digest(); expect(scope.firstWatchFunctionCounter).toBe(1); expect(scope.secondWatchFunctionCounter).toBe(1); scope.age = 4; scope.name = '2foo'; scope.$digest(); expect(scope.firstWatchFunctionCounter).toBe(2); expect(scope.secondWatchFunctionCounter).toBe(2); // This will fail! })); }); }); (function () { var jasmineEnv = jasmine.getEnv(); var htmlReporter = new jasmine.HtmlReporter(); jasmineEnv.addReporter(htmlReporter); jasmineEnv.specFilter = function (spec) { return htmlReporter.specFilter(spec); }; var currentWindowOnload = window.onload; window.onload = function() { if (currentWindowOnload) { currentWindowOnload(); } execJasmine(); }; function execJasmine() { jasmineEnv.execute(); } })(); &lt;/script&gt; &lt;/head&gt; &lt;body&gt;&lt;/body&gt; &lt;/html&gt; </code></pre> <p><a href="http://plnkr.co/edit/2DwCOftQTltWFbEDiDlA?p=preview">http://plnkr.co/edit/2DwCOftQTltWFbEDiDlA?p=preview</a></p> <p>PS:</p> <p>As stated by @reblace in a comment, it is of course possible to access the values:</p> <pre><code>$scope.$watch('[age,name]', function (newValue, oldValue) { var newAge = newValue[0]; var newName = newValue[1]; var oldAge = oldValue[0]; var oldName = oldValue[1]; }, true); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload