angularjs NG-IF值和功能之间的差异 [英] angularjs ng-if difference between value and function

问题描述

有没有使用任何区别
NG-如果用值或具有功能

  NG-IF =myvalue的
NG-如果=MYFUNC（）
 

UPDATE（为了更好地理解为什么我问的）

HTML

 ＆LT; D​​IV CLASS =导航栏导航栏默认导航栏静态顶数据-NG-控制器=NavController作为导航＆GT;
            ＆LT; D​​IV CLASS =容器＆GT;
                ＆LT; UL类=NAV导航栏，导航＆GT;
                    ＆LT;数据-UI-SREF =家级=Navbar的品牌＆GT;＆LT; I类=标志＆GT;＆LT; / I＆GT;角前preSS＆LT; / A＆GT;
                    ＆LT;李UI的SREF主动=主动＆GT;＆LT;数据-UI-SREF =家＆GT;家庭和LT; / A＆GT;＆LT; /李＆GT;
                ＆LT; / UL＆GT;
                ＆LT; UL类=NAV导航栏，导航栏导航右数据-NG-IF =＆GTnav.isAuthenticated（）！;
                    ＆LT;立GT;＆LT;数据-UI-SREF =session.login＆GT;登录上述＆lt; / A＆GT;＆LT; /李＆GT;
                    ＆LT;立GT;＆LT;数据-UI-SREF =session.signup＆GT;注册＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT; / UL＆GT;
                ＆LT; UL类=NAV导航栏，导航栏导航右数据-NG-IF =nav.isAuthenticated（）＆GT;
                    ＆LT;立GT;＆LT; I类=发发用户＆GT;＆LT; / I＆GT; ＆LT;跨度NG绑定=nav.isAuthenticated（）的用户名。＆GT;＆LT; / SPAN＆GT; ＆LT; A HREF =/ API /认证/注销数据-NG-点击=nav.logout（）＆GT;注销＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT; / UL＆GT;
            ＆LT; / DIV＆GT;
        ＆LT; / DIV＆GT;
 

JS

 函数NavController（$ rootScope，UserStorage）{
    VAR NAV =这一点;
    nav.isAuthenticated =功能（）{
        UserStorage.get（）;
    };
}
功能UserLoginController（$ rootScope，$状态，用户，UserStorage）{
    VAR用户=这一点;
    user.data = {};
        user.save =功能（）{
            Users.login（user.data）。然后（功能（响应）{
            的console.log（response.data）;
            UserStorage.set（response.data）;
            $ state.go（'家'）;
        }）
        .catch（功能（响应）{
            的console.log（响应）;
            user.errors = response.data;
        }）;
    };
}
 

如果我用这样的我有一个$摘要（）迭代达到

RE更新

（对于chandermani评论）

 函数UserStorage（$的sessionStorage）{
  返回{
    设置：功能（数据）{
        $ sessionStorage.user = angular.toJson（数据）;
    }，
    得到：函数（）{
        返回angular.fromJson（$ sessionStorage.user）;
    }，
    德尔：功能（）{
        删除$ sessionStorage.user;
    }
  };
}
 

解决方案

有关角都是前pression ，它评估了目前的范围方面。角做到这一点每个消化周期。

有更多的方式在脚下拍摄，如果你使用的是功能的方式。 MYFUNC 可以做

  $ scope.myfunc =功能（）{
   //做一些费时的工作
   返回的数据;
};
 

在这样每个消化周期约束力的评估将会使你的绑定和应用程序的情况下慢。

所以，如果你使用的是基于功能的结合确保功能做最小处理返回快。

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

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

UPDATE (for a better understanding why I'm asking for)

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 like this I've got a $digest() iterations reached

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;
    }
  };
}

解决方案

For angular both are expression, that it evaluates in context of current scope. Angular does this on each digest cycle.

There are more ways to shoot in the foot if you are using the function way. myfunc could do

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

In such a case the binding evaluation on each digest cycle will make your binding and app slow.

So if you are using function based binding make sure that functions return fast by doing minimum processing.

这篇关于angularjs NG-IF值和功能之间的差异的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！