AngularJS: Как обновить родительский контроллер

Когда будет отображаться страница index.html, будет вызван мой ApplicationController. Когда я вхожу в систему (успех входа в систему), я хочу обновить свой ApplicationController. Как это сделать?AngularJS: Как обновить родительский контроллер

Я определил ниже контроллеры в своем приложении.

1) Войти

angular.module('aclf').controller('LoginController', LoginController); 
    // The $inject property is an array of service names to inject. 
    LoginController.$inject = [ '$location', 'AuthenticationService', 
      'FlashService' ]; 
    function LoginController($location, AuthenticationService, FlashService) { 
     var loginController = this; 

     loginController.login = login; 

     (function initController() { 
      // reset login status 
      AuthenticationService.ClearCredentials(); 
     })(); 

     function login() { 
      loginController.dataLoading = true; 
      AuthenticationService.Login(loginController.username, 
        loginController.password, function(response) { 
         if (response.username === loginController.username) { 
          console.log(response.authToken); 
          AuthenticationService.SetCurrentUser(
            loginController.username, 
            response.authToken, true); 
          $location.path('/home'); 
         } else { 
          FlashService.Error(response.message); 
          loginController.dataLoading = false; 
         } 
        }); 
     } 
     ; 
    }

2) ApplicationCotroller

angular.module('aclf').controller('ApplicationController', 
      function($scope,$rootScope) { 
       $scope.currentUser = $rootScope.globals.currentUser; 
       console.log('Inside ApplicationController'); 
      })

3) HomeController- Когда домашний контроллер визуализации Я хочу, чтобы обновить часть, так как она содержит CurrentUser.

/** 
    * Home Controller 
    */ 

    angular.module('aclf').controller('HomeController', HomeController); 
    // The $inject property is an array of service names to inject. 
    HomeController.$inject = [ 'UserService', '$rootScope' ]; 
    function HomeController(UserService, $rootScope) { 
     var homeController = this; 

     homeController.user = null; 


     initController(); 

     function initController() { 
      loadCurrentUser(); 

     } 

     function loadCurrentUser() { 
      UserService.GetByUsername($rootScope.globals.currentUser.username) 
        .then(function(user) { 
         homeController.user = user; 
        }); 
     } 
    }

4) Это мой index.html страница Здесь я определил мое ApplicationController на части тела. Это необходимо обновлять по крайней мере, после входа в систему и выхода из системы

<body data-ng-controller="ApplicationController"> 


    <!-- TOPBAR START --> 
    <div id="layout-topbar" data-ng-show="currentUser"> 
     <ul id="top-menu"> 
      <li> 
       <span class="Fs22 FontRobotoLight">Welcome {{currentUser.username}} </span> 
      </li> 
      <li> 
       <a href="#/login" class="btn btn-primary">Logout</a> 
      </li> 
     </ul> 
    </div> 
    <!-- TOPBAR END --> 
    <div id="wrapper"> 
      <div id="wrapperIndent"> 

       <div id="layout-menu-cover" class="Animated05 ps-container"> 
        <div class="ps-scrollbar-x-rail" style="left: 0px; bottom: 3px;"> 
         <div class="ps-scrollbar-x" style="left: 0px; width: 0px;"></div> 
        </div> 
        <div class="ps-scrollbar-y-rail" style="top: 0px; right: 3px;"> 
         <div class="ps-scrollbar-y" style="top: 0px; height: 0px;"></div> 
        </div> 
       </div> 

       <div id="layout-portlets-cover"> 
        <div class="Container96 Fnone MarAuto"> 

         <div class="Container100"> 
          <div class="ContainerIndent"> 
           <div class="EmptyBox10"></div> 
           <div 
             data-ng-class="{ 'alert': flash, 'alert-success': flash.type === 'success', 'alert-danger': flash.type === 'error' }" 
             data-ng-if="flash" data-ng-bind="flash.message"></div> 
           <div data-ng-view></div> 
          </div> 
         </div> 

         <!-- footer --> 
         <div class="Container100"> 
          <div class="ContainerIndent TexAlCenter Fs14"> 
           Angular | All Rights Reserved.</div> 
         </div> 

        </div> 
       </div> 
      </div> 
     </div> 
</body>

PS: Я очень новой для AngularJS

источник

2015-10-07 Unknown

Но вы указали один один контроллер на странице html. Где вы объявили другие контроллеры (HomeController и LoginController)? – hic1086

@ hic1086 - Я определил частичные элементы, которые я не включил в вопрос. – Unknown

Я попытался перезагрузить страницу. Но он не работал.

я удалил прикладной контроллер и используется

$routeProvider.when('/home', { 
       controller : 'HomeController', 
       templateUrl : 'partials/home.html', 
       controllerAs : 'homeController', 
       leftNav : 'partials/left-nav-main.html', 
       topNav: 'partials/top-nav.html' 
    }) 

.when('/login', { 
      controller : 'LoginController', 
      templateUrl : 'partials/login.html', 
      controllerAs : 'loginController' 
     })

Здесь свойство templateUrl в определении маршрута ссылается на шаблон вида, который загружается в нг вида директивы элемента DIV. Я попытался смоделировать что-то похожее на то, что делает Angular для наших левых и верхней навигации. Значение свойства topNav используется для загрузки верхнего навигационного представления в элементе topnav div ("id = top-nav") с использованием директивы ng-include. Мы делаем то же самое и для левой навигации. Директива ng-if в левом навигационном разделе используется, чтобы скрыть левую навигацию, если текущая конфигурация маршрута не определяет свойство leftNav.

Последняя часть этой интеграции устанавливает свойство currentRoute и , привязывая его к ng-include. Угловой настраивает шаблон ng-view, используя свойство templateUrl конфигурации маршрута, но он не знает и не заботится о свойствах topNav и leftNav, которые мы добавили. Нам нужно написать какой-то пользовательский код, который связывает URL-адреса навигации с соответствующими директивами ng-includes.

$scope.$on('$routeChangeSuccess', function (e, current, previous) { 
$scope.currentRoute = current; 
});

Вот мой index.html

<div class="navbar navbar-default navbar-fixed-top top-navbar"> 
<!--Existing html--> 
<div id="top-nav-container" class="second-top-nav"> 
<div id="top-nav" ng-include="currentRoute.topNav"></div> 
</div> 
</div> 
<div class="container-fluid"> 
<div id="content-container" class="row"> 
<div class="col-sm-2 left-nav-bar" 
ng-if="currentRoute.leftNav"> 
<div id="left-nav" ng-include="currentRoute.leftNav"></div> 
</div> 
<div class="col-sm-10 col-sm-offset-2"> 
<div id="page-content" ng-view></div> 
</div> 
</div> 
</div>

Теперь левый нав и топ-нав появляется только на домашней странице и не появляется в странице входа.

источник

2015-10-14 16:35:38 Unknown

-1

Ну, я думаю, что лучшая практика для перезагрузки всей страницы:

Если вы используют angular-ui/ui-router

$state.reload();

Если вы используете другой маршрутизатор

$route.reload();

источник

2015-10-07 10:15:56 vjarysta

Где поставить эту функцию ($ route.reload();)? Я добавил это в метод run. Похоже, что не работает. – Unknown

Это мой корневой объект: $$ маршрут: Object контроллер: "HomeController" controllerAs: "HomeController" ключи: Array [0] originalPath: "/ дома" регулярное выражение:/^ \/дом $/ глобальной ложь IgnoreCase ложь LastIndex: 0 многострочный: ложный источник: "^ \/дом $" __proto__:/(?:)/ reloadOnSearch: истинный templateUrl: "обертоны/home.html" – Unknown

AngularJS: Как обновить родительский контроллер

ответ

Смежные вопросы