I have a very simple installation of an Angular application, the code is as follows:
index.html
<!DOCTYPE html> <html> <head> <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js'></script> <script src='app.js'></script> </head> <body ng-app="app"> <div ng-controller="MyCtrl"> <div ng-show="ready()"> Some content </div> </div> </body> </html>
And app.js
var app = angular.module('app', []); app.controller('MyCtrl', function($scope) { console.log("MyCtrl called") $scope.ready = function() { console.log("ready called"); return true; } })
If you run this with the console open, you will see that MyCtrl is called once and ready to be called twice. I spent hours trying to figure it out, I see no reason why $scope.ready will be called something, but exactly once.
If you use Angular v1.1.5 and use ng-if instead of ng-show , you will have the same behavior, but if you use ng-init , it correctly calls $scope.ready once. In my case, I will need ng-show or ng-if .
Plunkr: http://plnkr.co/edit/ZSwVNLeFSuhbouXZu9SM?p=preview
Explanation: To clarify what I am aiming for, say, $scope.ready returns false at some point later (perhaps it calls an AJAX call, which should NOT be called more than once), I would like some content was not longer to be visible. That is, dynamic behavior is based on the result of $scope.ready .
Any ideas? Thanks for the help!
For writing this and this, this is not a problem.