Onsenui on monaca Range Tag Integration

I'm trying to integrate with the controller using the range tag of angularjs and onsenui, but if I take an excerpt, on the html side,

<input type="range" class="range" max=100ng-model="playtime"ng-change="rangeChange()">

on the controller side,

$scope.rangeChange=function(){
    console.log($scope.playtime);
}

If you write and run it, the first time you manipulate the range tag, it will be output to console.log, but after the second time, it will not respond.
What should I do if I change the console.log after the second time?

monaca onsen-ui angularjs

2022-09-30 20:49

1 Answers

If you are not mistaken about the intent of the question, I think it will work according to the code written in the question.
If it doesn't work well, there may be a reason why it's not written in the question.

ons.bootstrap()
  .controller('MainCtrl', function($scope){
    $scope.rangeChange=function(){
      console.log($scope.playtime);
    }
  })

<link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/css/onsenui.css"rel="stylesheet"/>
<link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/css/onsen-css-components.css"rel="stylesheet"/>
<script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/js/angular/angular.min.js"></script>
<script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/js/onsenui.min.js"></script>

<bodying-controller="MainCtrl">
  <ons-toolbar>
    <div class="center">Main</div>
  </ons-toolbar>

  <p style="padding-top:80px;color:#999;text-align:center">Main Page Contents</p>
  <div style="text-align:center">
    <input type="range" class="range" max=100ng-model="playtime"ng-change="rangeChange()">
    <br/><br/>
    <span style="font-weight:bold">{{playtime}}}</span>
  </div>
</body>

2022-09-30 20:49

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656