AngularJS指令中的動畫，事件未觸發

我正在嘗試在指令中的「輸入」事件後執行某些操作。當模板中加載的事件不會開火。AngularJS指令中的動畫，事件未觸發

這裏是應用程序聲明

angular 
    .module('MyApp', [ 
    'ngAnimate', 
    'ngCookies', 
    'ngResource', 
    'ngRoute', 
    'ngSanitize', 
    'ngTouch' 
    ]) 
    .config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
     templateUrl: 'views/home.html', 
     controller: 'HomeCtrl' 
     }) 
     .when('/in-the-community', { 
     templateUrl: 'views/in-the-community.html', 
     controller: 'CommunityCtrl' 
     }) 
     .otherwise({ 
     redirectTo: '/' 
     }); 
    });

起初我使用的路由提供給我一個模板頁面。然後我試圖在這些模板中使用一個指令來提供另一個視圖。這是通過使用我的模板頁面

<div class="flex"> 
    <div class="fc fci image-wrapper" id="home-banner"> 
    </div> 

    <div class="fc fcc"> 
     <section show-and-hide-content="{{ sub_content }}"> 
     </section> 
    </div> 
</div>

這載荷以下指令

angular.module('rubisApp') 
    .directive('showAndHideContent', function ($animate) { 
    return { 
     templateUrl: 'views/community-sub.html', 
     controller: 'CommunitySubCtrl', 
     link: function(scope, element, attributes) { 
     $animate.on('enter', element, 
      function callback(element, phase) { 
      console.log('attributes.showAndHideContent'); 
      } 
     ); 
     } 
    }; 
    });

控制檯日誌未運行，而我只能推測如下因爲它不點火$animate.on事件。

角度是否將ng-enter類應用於指令中的templateUrl？

我很新的角度，所以如果這是這樣做的錯誤方式，替代品也真的有幫助。

來源

2016-04-29 Chris Townsend

從來沒有聽說過「進入」事件，並且無法通過谷歌找到關於它的消息 - 您是否指「按Enter鍵」時按下了？ – messerbill

@messerbill，'enter'是一個angularjs結構事件，@ChrisTownsend什麼是'container'？你有沒有把它定義在某個你沒有展示的地方？還是你的意思是使用'element'？ –

不，所以對於動畫提供者，當使用ng-view時，它會在不同的狀態下添加類。我試圖做一個指令，做一些回調 –

$ animate依賴關係未被拉入指令。

angular.module('MyApp') 
    .directive('showAndHideContent',['$animate', function ($animate) { 
    return { 
     templateUrl: 'views/community-sub.html', 
     controller: 'CommunitySubCtrl', 
     link: function(scope, element, attributes) { 
     $animate.on('enter', element, 
      function callback(element, phase) { 
      console.log('attributes.showAndHideContent'); 
      } 

     ); 

     } 

    }; 
    }]);

來源

2016-05-03 14:37:56

我看到你正在使用控制器。你不能在那裏創建活動嗎？我檢查了我的代碼，並在控制器上有此代碼段，以便在路由更改時銷燬間隔，注意我使用$和'$ destroy'，使用$。可以這樣嗎？

$scope.$on('$destroy', function() { 
        $interval.cancel($scope.interval); 
       });

來源

2016-05-10 10:03:57

AngularJS指令中的動畫，事件未觸發

回答

相關問題