在我的Angular控制器中,“未定义经过身份验证。我只想在用户登录时显示更新按钮。我在用户登录时使用ng-show,否则隐藏按钮。有人可以指导我我吗?做错了吗?

的JavaScript

$scope.signIn = function () {
   $rootScope.auth.$login('password', {
     email: $scope.email,
     password: $scope.password
   }).then(function (user) {
     Materialize.toast('Logged in successfully', 1000);
     console.log(authenticated);
     $scope.authenticated = true;
   }, function (error) {
     if (error = 'INVALID_EMAIL') {
       Materialize.toast('Email invalid or not signed up — trying to sign you up!', 5000);
       $scope.signUp();
     } else if (error = 'INVALID_PASSWORD') {
       console.log('wrong password!');
       Materialize.toast('Invalid password', 1000);
     } else {
       console.log(error);
     }
   });
 };

 $scope.loggedin = false;


模板

<div ng-if="loggedin">
   <a class="btn waves-effect waves-red" ng-href="/#/editWelcome/{{welcome._id}}">Update
 </a>
</div>

最佳答案

为了用一个例子来回答这个问题,您遇到了多个问题,变量名不一致,console.log中有一个未定义的对象,称为authenticated,

$scope.authenticated = true; VS $scope.isLoggedIn = false.


您应该使用下面的代码设置在控制器和$ rootScope登录的代码。它包括让自己避免在控制器中使用$ scope,而转向“ controller as vm”,我建议您查看http://www.johnpapa.net/angular-style-guide/

该代码还提供了一个日志记录实用程序,因为它可以帮助您记录日志错误,因为您可以在服务中添加try / catch。

控制器和日志记录实用程序JS

(function () {

    var moduleId = 'app';
    var controllerId = 'AngularController';

    //define controller
    angular
        .module(moduleId)
        .controller(controllerId, angularController);

    angularController.$inject = ['$rootScope', 'logUtil'];

    //Your controller code
    function angularController($rootScope, logUtil) {

        var vm = this;
        vm.title = 'Your controller title';
        vm.isLoggedIn = angular.isDefined($rootScope.isLoggedIn) ? $rootScope.isLoggedIn : false;
        vm.signIn = signIn;
        vm.signUp = signUp;

        function signIn() {
            $rootScope.auth.$login('password', {
                email: $scope.email,
                password: $scope.password
            }).then(function (user) {
                Materialize.toast('Logged in successfully', 1000);
                logUtil.logDebug('authenticated');
                vm.userId = user.id;
                $rootScope.isLoggedIn = true;
                vm.isLoggedIn = true;
            }, function (error) {
                $rootScope.isLoggedIn = false;
                vm.isLoggedIn = false;
                if (error === 'INVALID_EMAIL') {
                    logUtil.logDebug('no user');
                    Materialize.toast('Email invalid or not signed up — trying to sign you up!', 5000);
                    vm.signUp();
                } else if (error === 'INVALID_PASSWORD') {
                    logUtil.logDebug('wrong password');
                    Materialize.toast('Invalid password', 1000);
                } else {
                    logUtil.logError(error);
                }
            });
        };

        function signUp() {
            //sign up function
        }

        activate();

        function activate() {
            logUtil.logDebug('Controller activated: ' + controllerId);
        }
    };

    //logging utility constants
    angular.module(moduleId).constant('logUtilConstants', {
        LOG_ERROR_MESSAGES: true,
        LOG_DEBUG_MESSAGES: true
    });

    //logging service
    angular.module(moduleId).service('logUtil', logUtil);

    logUtil.$inject = ['$log','logUtilConstants'];

    function logUtil($log, logUtilConstants) {

        var service = {

            logError: function (logMessage) {
                if (logUtilConstants.LOG_ERROR_MESSAGES) {
                    $log.error(logMessage);
                }
            },

            logDebug: function () {
                try {
                    if (logUtilConstants.LOG_DEBUG_MESSAGES) {
                        var args = Array.prototype.slice.call(arguments, 0);
                        var strArgs = args.join(' ');
                        $log.debug(strArgs);

                    }
                } catch (e) {
                    console.log('log debug error', e);
                }
            }
        }
        return service;
    }

})();


控制器标记

<div ng-controller="AngularController as vm">
   {{ vm.title }}
</div>


条件Div标记

<div ng-if="vm.loggedin">
   <a class="btn waves-effect waves-red" ng-href="/#/editWelcome/{{vm.userId}}">Update</a>
</div>

07-27 13:45