angularjs - Angular Material - Long Textarea Forces Scroll To Top -
i'm having difficulties text areas , angular material.
when there's enough content in text area force bottom "below fold", typing causes page scroll top. continuing type scrolls page down , scrolls up.
is bug in ngmaterial, or doing wrong here?
(i've checked documentation multiple times trying see if did wrong.)
code i'm using, stripped of unnecessary:
angular.module('testtextarea', [ 'ngmaterial' ]) .controller('appcontroller', function($scope) { $scope.level = { title: '', content: 'asdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\nasdfasdf\n' }; });<!doctype html> <html ng-app="testtextarea"> <head> <link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=robotodraft:300,400,500,700,400italic"> </head> <body ng-controller="appcontroller"> <md-content layout-padding layout="column" flex="30"> <form novalidate flex> <div layout> <md-input-container flex> <label for="title">title</label> <input name="title" id="title" ng-model="level.title" ng-model-options="{ debounce: 500 }" /> </md-input-container> </div> <div layout> <md-input-container flex> <label for="html">content</label> <textarea name="html" id="html" ng-model="level.content" columns="1" ng-model-options="{ debounce: 500 }"></textarea> </md-input-container> </div> </form> </md-content> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.js"></script> <script src="script.js"></script> </body> </html>
Comments
Post a Comment