javascript - Material Design Lite - animation not work inside ng-view div

Do you know why the first button animation does not working, after refresh the page? After click the first button we can only see the button shadow but animation not working. Thank u in advance.

<!doctype html>

</div>
<button class="mdl-button mdl-js-ripple-effect mdl-js-button mdl-button--fab mdl-color--accent">
    <i class="material-icons mdl-color-text--white" role="presentation">add</i>
</button>
<script src=".4.3/angular.min.js"></script>
<script src=".js/1.4.3/angular-animate.min.js"></script>
<script src=".js/1.4.3/angular-route.min.js"></script>
<script src=".getmdl.io/1.0.2/material.min.js"></script>
<script src="app.js"></script>

<button class="mdl-button mdl-js-ripple-effect mdl-js-button mdl-button--fab mdl-color--accent">
<i class="material-icons mdl-color-text--white" role="presentation">add</i>

var shaApp = angular.module('shaApp', ['ngAnimate','ngRoute']);
shaApp.config(['$routeProvider',
function($routeProvider) {
    $routeProvider.
    when('/', {
        templateUrl: 'dashboard.html',
        controller: 'dashboardCtrl',
    }).
    otherwise({
        redirectTo: '/'
    });
   }
]);
shaApp.controller('dashboardCtrl', ['$scope', '$http', function($scope, $http) {}}]);

Do you know why the first button animation does not working, after refresh the page? After click the first button we can only see the button shadow but animation not working. Thank u in advance.

<!doctype html>

</div>
<button class="mdl-button mdl-js-ripple-effect mdl-js-button mdl-button--fab mdl-color--accent">
    <i class="material-icons mdl-color-text--white" role="presentation">add</i>
</button>
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script src="https://cdnjs.cloudflare./ajax/libs/angular.js/1.4.3/angular-animate.min.js"></script>
<script src="https://cdnjs.cloudflare./ajax/libs/angular.js/1.4.3/angular-route.min.js"></script>
<script src="https://storage.googleapis./code.getmdl.io/1.0.2/material.min.js"></script>
<script src="app.js"></script>

<button class="mdl-button mdl-js-ripple-effect mdl-js-button mdl-button--fab mdl-color--accent">
<i class="material-icons mdl-color-text--white" role="presentation">add</i>

var shaApp = angular.module('shaApp', ['ngAnimate','ngRoute']);
shaApp.config(['$routeProvider',
function($routeProvider) {
    $routeProvider.
    when('/', {
        templateUrl: 'dashboard.html',
        controller: 'dashboardCtrl',
    }).
    otherwise({
        redirectTo: '/'
    });
   }
]);
shaApp.controller('dashboardCtrl', ['$scope', '$http', function($scope, $http) {}}]);

Share Improve this question asked Aug 2, 2015 at 18:59 user3708790 514 bronze badges

Add a ment |

1 Answer 1

Sorted by: Reset to default 8

You might need to upgrade the dynamic elements (as referenced here).

shaApp.run(function($rootScope, $location, $timeout) {
    $rootScope.$on('$viewContentLoaded', function() {
        $timeout(function() {
            ponentHandler.upgradeAllRegistered();
        });
    });
});

*[edit] fix misspelled word

发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745590114a4634781.html

javascript - Material Design Lite - animation not work inside ng-view div - Stack Overflow

1 Answer 1

发表回复

评论列表（0条）

联系我们

400-800-8888

javascript - Material Design Lite - animation not work inside ng-view div - Stack Overflow

1 Answer 1

相关推荐