加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angularjs ng-if值和功能之间的差异

发布时间:2020-12-17 07:50:05 所属栏目:安全 来源:网络整理
导读:使用是否有任何区别 ng-if是一个值还是一个函数? ng-if="myvalue"ng-if="myfunc()" 更新(为了更好地理解我要求的原因) HTML div class="navbar navbar-default navbar-static-top" data-ng-controller="NavController as nav" div class="container" ul cla
使用是否有任何区别
ng-if是一个值还是一个函数?
ng-if="myvalue"
ng-if="myfunc()"

更新(为了更好地理解我要求的原因)

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

如果我使用这样的话,我就得到了$digest()迭代

重新更新

(对于chandermani评论)

function UserStorage($sessionStorage) {
  return {
    set: function(data) {
        $sessionStorage.user = angular.toJson(data);
    },get: function() {
        return angular.fromJson($sessionStorage.user); 
    },del: function() {
        delete $sessionStorage.user;
    }
  };
}
对于角度,两者都是表达式,它在当前范围的上下文中进行评估. Angular在每个摘要周期都这样做.

如果使用功能方式,有更多的方法可以用脚射击. myfunc可以做到

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

在这种情况下,对每个摘要周期的绑定评估将使您的绑定和应用程序变慢.

因此,如果您正在使用基于函数的绑定,请确保通过执行最少的处理来快速返回函数.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读