ファクトリ関数の状態変更でng-showが機能しない

Question

ユーザーが正常にログインすると、ログインからログアウトにテキストを変更して、URLを家からダッシュボードに変更したいと考えています。

$stateProvider.state('home',{url:'/',views:{'':{templateUrl:'./partials/home/home.tpl.html'},'navbar@home' {templateUrl:'./partials/navbar/navbar.tpl.html'},'lsidebar@home':{templateUrl:'./partials/sidebars/lsidebar.tpl.html'},'content@home'{templateUrl:'./partials/content/content.tpl.html'}},authenticate:false }) 
    .state('dashboard',{url:'/dashboard',views:{'':{templateUrl:'./partials/home/home.tpl.html'},'navbar@dashboard':{templateUrl:'./partials/navbar/navbar.tpl.html'},lsidebar@dashboard':  {templateUrl:'./partials/sidebars/lsidebar.tpl.html'},'content@dashboard':{templateUrl:'./partials/dashboard/dashboard.tpl.html'}},authenticate:true}) 

サンプル出荷：

coreApp.factory('AuthFactory',function($http){ 

var obj={}; 
var isAuthenticated=false; 

obj.login=function(data){ 
    return $http.post('http://reqres.in/api/login',data); 
} 
obj.userInfo=function(){ 
    isAuthenticated=true; 
    return {name:'xyz',balance:'10.00'}; 
} 
obj.isAuthenticated=function(){ 
    return isAuthenticated; 
} 

return obj; }); 

HTML：

<a ui-sref='login' ng-show='!AuthFactory.isAuthenticated()'><i class="glyphicon glyphicon-off"></i> Sign in</a> 
    <a ui-sref='logout' ng-show='AuthFactory.isAuthenticated()'><i class="glyphicon glyphicon-off"></i>Logout </a> 

ブートストラップ：

.run(['$rootScope', '$state','$stateParams','AUTH_EVENTS','AuthFactory',function($rootScope, $state, $stateParams,AUTH_EVENTS,AuthFactory){ 
$rootScope.$state = $state; 
$rootScope.$stateParams = $stateParams; 

$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) { 

    if(toState.authenticate && !AuthFactory.isAuthenticated()) 
    { 
     $state.transitionTo("login"); 
     event.preventDefault(); 
    } 


    console.log("AuthFactory"+AuthFactory.isAuthenticated()); 
    }); 

    $rootScope.$on(AUTH_EVENTS.notAuthenticated,function(event){ 
    console.log('You not logged in'); 
    });}]); 

問題は、ユーザーが更新され、印刷物値のされてルートスコープに記録されますときですAuthFactory.isAuthenticat ed（）をtrueとし、urlも変更していますが、lsidebar.tpl.htmlのテキストは変更されません。

$スコープがわかりました。$ applyはそれを行う方法です。しかし、私はそのような場合に正しい方法が混乱しているか、$ scopeを使用することは問題ありません。関数。

Answer 1

テンプレートでサービスを直接使用することはできません。サービスは、Angularが信頼できる関数に注入する方法を知っているオブジェクトです。

つまり、サービスにリンクを付けてコントローラのスコープにサービスを挿入し、プロパティを定義して、テンプレートでそのサービスを使用できるようにする必要があります。

JS

app.controller('myController', ['$scope', 'myService', function ($scope, myService) { 
    $scope.myService = myService; 
}); 

HTML

<div ng-controller="myController">{{ myService.someGetterFn() }}</div> 

それとも

JS

app.controller('myController', ['myService', function (myService) { 
    this.myService = myService; 
}); 

HTML

<div ng-controller="myController as ctrl">{{ ctrl.myService.someGetterFn() }}</div> 

Answer 2

AngularJSは、インライン式を扱うときに少し混乱します。場合例えば（

$scope.$apply(aaa = true); 

が、これがすべての状況で呼び出すことができないことに注意してください。また

ng-show="(!AuthFactory.isAuthenticated())" 

、および$apply()に関連して、（ただし常に適用されません）それを使用する方法は次のとおりです。試してみてくださいAngularがダイジェストの変更中に呼び出されると、エラーメッセージが表示されます）。