2013-08-25 6 views
2

У меня проблема с моим приложением для angularjs для событий и слушателей.Загрузка Angularjs и загрузка асинхронного модуля

Мое приложение имеет файл index.html, как это:

<body ng-app="ua.myApp"> 
    <!-- Navigation bar --> 
    <ng-include src="'app/common/navbar/navbar.tpl.html'"></ng-include> 
    <ng-view></ng-view> 

    <script type="text/javascript" src="app/common/navbar/navbar.js"></script> 
    <script type="text/javascript" src="app/part1/part1.js"></script> 

</body> 

В контроллере NavBar У меня есть слушатель:

console.log('Setup event listner - navBar: update'); 
$scope.$on('navBar: update', function() { 
    if (uaContext.loginStatus.get() == true) { 
     $scope.setLoggedInBar(); 
    } else { 
     $scope.setLoggedOutBar(); 
    } 
}); 

А в приложении part1 я транслируют событие:

function ($scope, $rootScope, $routeParams, uaContext) { 
    console.log('Send event listner - navBar: update'); 
    $scope.$on('$routeChangeSuccess', function() { 
     uaContext.productId.set($routeParams.productId); 
     uaContext.appName.set('part 1'); 
     $rootScope.$broadcast('navBar: update'); 
    }); 
} 

Зависимости в myApp находятся в таком порядке:

var myApp = angular.module('ua.myApp', [ 
    'ua.NavBar', 
    'ua.Part1']); 

Работает нормально. Журнал консоли:

Setup event listner - navBar: update (nav_bar.js) 
Send event listner - navBar: update (part1.js) 

Вопрос заключается в том, что иногда событие отправляется part1 приложение перед слушателем в навигационной панели находится в рабочем состоянии. Таким образом, мы получаем следующую ситуацию:

Send event listner - navBar: update (part1.js) 
Setup event listner - navBar: update (nav_bar.js) 

Таким образом, навигационная панель не обновляется.

Вы знаете, как я могу исправить эту проблему? Возможно, я могу выпустить событие в другом случае, чем routeChangeSuccess, но я не нашел документацию о событиях.

Спасибо

ответ

1

Вы можете слушать для $includeContentLoaded события в $scope, который относится к где ng-include установлен.

Другое решение, а не полагаться на события синхронизации, равно create a service, которые могут быть введены в оба контроллера, которые могут использоваться для совместного использования состояния навигации между ними. Таким образом, даже если событие запускается до создания контроллера navbar, контроллер навигатора может считывать соответствующее состояние из общей службы.

+0

Фактически данные уже переданы благодаря службе uaContext. Одним из решений может быть добавление часов на переменные этой службы, но мне придется использовать несколько переменных в службе. Так что мне придется поместить часы на все элементы, запрошенные в сервисе? Это лучший способ? – Julio

+0

У вас уже есть услуга, хорошая работа! Да, я думаю, что если у вас разные взгляды, которые должны отвечать на переменные (состояние) этой службы, тогда разоблачение этих объектов в качестве свойств службы, которые можно просмотреть, является разумным способом. – jandersen

+0

Хорошо, но эффективно ли просматривать несколько переменных в сервисе? У меня есть 10 переменных для просмотра. Одним из способов решения проблемы может быть добавление переменной «изменено» в эту службу и ее изменение после каждой модификации переменной в службе. Тогда я смогу посмотреть эту переменную. Другой способ обхода - использовать событие. Но я не могу поймать событие, если включенная навигационная панель загружается после трансляции события. Событие 'includeContentLoaded' не может решить эту проблему, поскольку мне нужно отправить событие из ng-view Part1 на включенную панель-навигатор – Julio

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