Angularjs ng - if the difference between value and function

Is there any difference in using ng-if with a value or with a function?

ng-if="myvalue" ng-if="myfunc()" 

UPDATE (for a better understanding of why I ask)

HTML

 <div class="navbar navbar-default navbar-static-top" data-ng-controller="NavController as nav"> <div class="container"> <ul class="nav navbar-nav"> <a data-ui-sref="home" class="navbar-brand"><i class="logo"></i> Angular Express</a> <li ui-sref-active="active"><a data-ui-sref="home">Home</a></li> </ul> <ul class="nav navbar-nav navbar-right" data-ng-if="!nav.isAuthenticated()"> <li><a data-ui-sref="session.login">Log in</a></li> <li><a data-ui-sref="session.signup">Sign up</a></li> </ul> <ul class="nav navbar-nav navbar-right" data-ng-if="nav.isAuthenticated()"> <li><i class="fa fa-user"></i> <span ng-bind="nav.isAuthenticated().username"></span> <a href="/api/auth/logout" data-ng-click="nav.logout()">Logout</a></li> </ul> </div> </div> 

Js

 function NavController($rootScope, UserStorage){ var nav = this; nav.isAuthenticated = function() { UserStorage.get(); }; } function UserLoginController($rootScope,$state, Users, UserStorage) { var user = this; user.data = {}; user.save = function() { Users.login(user.data).then(function(response) { console.log(response.data); UserStorage.set(response.data); $state.go('home'); }) .catch(function(response) { console.log(response); user.errors = response.data; }); }; } 

If I use this, I have the $ digest () iterations achieved

RE UPDATE

(for chandermani comment)

 function UserStorage($sessionStorage) { return { set: function(data) { $sessionStorage.user = angular.toJson(data); }, get: function() { return angular.fromJson($sessionStorage.user); }, del: function() { delete $sessionStorage.user; } }; } 
+8
angularjs angularjs-directive
source share
2 answers

For angular, both are expression parameters, which it evaluates in the context of the current scope. angular does this in every digest cycle.

There are many ways to shoot in the foot if you use the function. myfunc could

 $scope.myfunc=function() { //do some time consuming work return data; }; 

In this case, evaluating the binding in each digest cycle will make your binding and application slower.

So, if you use function binding, make sure that functions return quickly with minimal processing.

+6
source share

Calling functions in ng-repeat directives can cause some performance problems, but if this is one assessment, then, as far as I noticed, there really is no difference.

I am always trying to evaluate a property: ng-if="myValue" will evaluate the scope variable $scope.myValue

0
source share

All Articles