angularjs – 如何触发UI-Router View加载事件?

前端之家收集整理的这篇文章主要介绍了angularjs – 如何触发UI-Router View加载事件?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
测试ui路由器的第一时间,但测试的事件在这一刻,我似乎无法理解如何触发$ viewContentLoaded或加载。虽然,我有stageChangeSuccess等工作!我把所有东西都推到了 http://punkbit.com/space_competition/,还在这里添加了一些代码。当新的视图加载到ui-view时,我预计会触发事件。但我想我在这里遗漏了一些东西!
<div class="pure-g">
        <div class="pure-u-1" ui-view>
        </div>
    </div>


    <!-- s: template partials -->
    <script type="text/ng-template" id="menu.html">
    <div class="pure-menu pure-menu-open pure-menu-horizontal">
        <ul>
            <li><a href="#/home">home</a></li>
            <li class="pure-menu-selected"><a href="#/like_gate">like_gate</a></li>
            <li><a href="#/terms_and_conditions">terms_and_conditions</a></li>
            <li><a href="#/enter_competition">enter_competition</a></li>
        </ul>
    </div>
    </script>
    <script type="text/ng-template" id="home.html">
    <p>home.html template! fbLike is {{fbLike}}</p>
    </script>
    <script type="text/ng-template" id="enter_competition.html">
    <p>enter_competition.html template!</p>
    </script>
    <script type="text/ng-template" id="like_gate.html">
    <p>like.html template!</p>
    </script>
    <script type="text/ng-template" id="terms_and_conditions.html">
    <p>terms_and_conditions.html template!</p>
    </script>
    <!-- e: template partials -->

main.js

angular.module("space_competition",['ui.router'])

.config(function($stateProvider,$urlRouterProvider,$locationProvider){

    $stateProvider
        .state('home',{
            url: '/home',templateUrl: 'home.html',controller: 'homeCtrl',resolve: {
                fb_like: 'fbLike'
            }
        })
        .state('enter_competition',{
            url: '/enter_competition',templateUrl: 'enter_competition.html',controller: 'enterCompetitionCtrl',resolve: {
                fb_like: 'fbLike'
            }
        })
        .state('like_gate',{
            url: '/like_gate',templateUrl: 'like_gate.html',controller: 'likeGateCtrl'
        })
        .state('terms_and_conditions',{
            url: '/terms_and_conditions',templateUrl: 'terms_and_conditions.html',controller: 'termsAndConditionsCtrl'
        });

        $urlRouterProvider.otherwise("/home");

        //$locationProvider.hashPrefix('!');

})

.run(function($rootScope){

    $rootScope
        .$on('$stateChangeStart',function(event,toState,toParams,fromState,fromParams){ 
                console.log("State Change: transition begins!");
        });

    $rootScope
        .$on('$stateChangeSuccess',fromParams){ 
                console.log("State Change: State change success!");
        });

    $rootScope
        .$on('$stateChangeError',fromParams){ 
                console.log("State Change: Error!");
        });

    $rootScope
        .$on('$stateNotFound',fromParams){ 
                console.log("State Change: State not found!");
        });

    $rootScope
        .$on('$viewContentLoading',viewConfig){ 
                console.log("View Load: the view is loaded,and DOM rendered!");
        });

    $rootScope
        .$on('$viewcontentLoaded',and DOM rendered!");
        });

})

.controller('homeCtrl',function($scope,fbLike){

    $scope.fbLike = fbLike.liked();

})

.controller('enterCompetitionCtrl',fbLike){

    fbLike.liked();

})

.controller('likeGateCtrl',function($scope){

})

.controller('termsAndConditionsCtrl',function($scope){

})

.factory('fbLike',function($http,$q){

    return {

        liked: function(){
            return true;
        }

    };

});

任何有经验的人都可以看看吗?

感谢:D

看起来你有$ viewcontentLoaded而不是$ viewContentLoaded。你忘了把骆驼的资本化吗?

猜你在找的Angularjs相关文章