AngularJS: $ viewContentLoaded disparado antes da exibição parcial aparecer

Para uma visão parcial, quero fazer algumas coisas em JavaScript que normalmente faria com$(document).ready(function() {...}), por exemplo. vincular ouvintes venet a elementos. Eu sei que isso não funciona para AngularJS e exibições parciais carregadas na exibição "raiz".

Assim, adicionei um ouvinte ao controlador que escuta o$viewContentLoaded evento. A função do ouvinte é invocada, portanto, o evento é disparado, mas parece-me que é antes da renderização da exibição parcial. Também não vejo os elementos quando defino um ponto de interrupção na função do ouvinte e o depuro com firebug, nem a seleção de jquery na função encontra os elementos da vista parcial.

É assim que o controlador se parece:

angular.module('docinvoiceClientAngularjsApp')
  .controller('LoginController', function ($scope, $rootScope) {

$scope.$on('$viewContentLoaded', function(event) {
  console.log("content loaded");
  console.log($("#loginForm"));   // breakpoint here 
});

[...]

Eu acho que estou fazendo algo errado, pois havia mais postagens no stackoverflow, se esse é um bug comum.

Como eu estou usandoroteador ui evisualização da interface do usuário, Darei a você um trecho do arquivo de roteamento:

angular
  .module('docinvoiceClientAngularjsApp', [
    'ui.router',
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ngMessages',
    'ngRoute',
    'ngSanitize',
    'ngTouch'
  ])
 .config(function ($routeProvider, $stateProvider) {
    $stateProvider
    .state('login', {
        url: '/',
        templateUrl: 'components/login/loginView.html',
        controller: 'LoginController'
    })
    .run(['$state', function ($state) {
        $state.transitionTo('login');
    }])

 [...]

Qualquer ajuda é apreciada. Obrigado e melhores cumprimentos

ATUALIZAÇÃO 1: Eu reduzi o erro para o seguinte caso de usuário: O loginView.html é semelhante ao seguinte:

<div id="loginContainer" style="width: 300px">
  <form id="loginForm" ng-submit="login(credentials)" ng-if="session.token == undefined">

[...]

Assim que eu remover ong-if a partir da tag div, ele funciona conforme o esperado. O evento é acionado depois que o DOM é renderizado, portanto, o jQuery encontra o elemento. Se ong-if é anexado à tag div, o comportamento é o primeiro descrito.

ATUALIZAÇÃO 2: Conforme prometido, adicionei uma demonstração funcional que mostra o comportamento diferente ao adicionar umng-if directiva. Alguém pode me apontar a direção certa? Não se atenha ao formulário de login como tal, pois há muitos outros casos de uso nos quais desejo remover certas partes de uma exibição com base em alguma expressão e fazer algumas coisas em JavaScript após a exibição parcial estar pronta.

Você pode encontrar a demonstração de trabalho aqui:Demo

questionAnswers(3)

yourAnswerToTheQuestion