观看ng-include活动?

时间:2014-02-09 20:53:19

标签: javascript angularjs angularjs-ng-include

有人可以举例说明如何在ng-include上观察发射事件吗? 确切地说,我想在我的指令中观察$ includeContentLoaded事件...... 这是我的HTML:

<div class="page_container">
  <div ng-include="menu" class=""></div>
<section>
        <about  ng-click="loadpantone()">

        </about>
        <div class="pantone_wrapper">
            <div ng-include="template" tabindex="0" id="focus_force" ng-keydown="keypress($event.keyCode)" ng-class="PrevNext"  class="pantoneani remo pantonebg blue" ></div>
        </div>
</section>
<section class="right_side"><p>Build a Web doctor</p></section>
</div>

指令:

'use strict';
/*global $:false */
angular.module('bawdApp')
  .directive('about', function () {
    return {
      templateUrl: 'views/pantone-inner.html',
      restrict: 'AE',
      link: function postLink($scope, element, $emit) {
                function border(valueWidth){
                  $('.page_cont_wrap').css('border', valueWidth+'px solid #aaFFFF');
                }
        $(element).css({'position': 'absolute'}).delay(200).animate({
                    'margin-left': '-160px',
                    'margin-top': '-233px',
                    'left': '50%',
                    'top': '50%'
                }, 200);
                $scope.loadpantone = function loadpantone(){
                    border(0);
                    $scope.template = $scope.pantonesAbout[0].url;
                    $('.top_left_logo.white  img').css('position', 'fixed');
                };
                $scope.$watch('$includeContentLoaded', function(){
                    $('').focus();
                });
      }
    };
  });

控制器:

'use strict';
angular.module('bawdApp')
  .controller('AboutCtrl', function ($scope) {
  $scope.pantonesAbout = [
            {name:'Pantone intro', url:'views/pantone_about.html'},
            {name:'Pantone one', url:'views/about_patone_one.html'},
            {name:'Pantone two', url:'views/about_patone_two.html'},
            {name:'Pantone three', url:'views/about_patone_three.html'},
            {name:'Pantone four', url:'views/about_patone_four.html'},
            {name:'Pantone five', url:'views/about_patone_five.html'},

        ];
  $scope.pantoneconter = 0;
});

1 个答案:

答案 0 :(得分:8)

发出您正在寻找的事件。这意味着您必须按$on收听:

$scope.$on('$includeContentLoaded', function(){
    console.log(arguments);
});