I investigated further and found the solution. Hopefully one of the onsen.io folks will see this…

Edit onsenui.js in the onsenui package and add _contentReady to the ons$1
variable, i.e.

var ons$1 = {
  animit: Animit,
  defaultPageLoader: defaultPageLoader,
  elements: onsElements,_
  GestureDetector: GestureDetector,
  modifier: modifier,
  notification: notification,
  orientation: orientation,
  pageAttributeExpression: pageAttributeExpression,
  PageLoader: PageLoader,
  platform: platform,
  softwareKeyboard: softwareKeyboard,
  _autoStyle: autoStyle,
  _internal: internal$1,
  _readyLock: new DoorLock(),
  _util: util,
  _contentReady: contentReady // this was added
};

BTW, thanks for a great product. I like how it can be easily used for a website.

I am using onsen with Angular 5. When I try to use the ons-select, I get an error on initialization where “ons is not defined”. It is occuring in the ons-select.js code line 51 “ons._contentReady(this._element, function() { _this._element.value = obj; });”. This causes the ons-select to not update the ngModel.

Thanks,

Aaron

I am trying to use ons-lazy-repeat with angular 5, and it appears to be not working right. First thing I found out is to reset the list with new data, I had to first set the array to empty and then a half a second later set the array to the final values.

this.lazyData = [];
setTimeout( () => {
     this.lazyData = response.data;
     this.lazyRepeat.refresh();
});

Now the bug I am stuck on is when the list is large enough to require scrolling, the list is actually repeated three times in series. The list has 17 ons-list-items in it. I am using onsenui v2.9.1

I have been using google maps integrated nicely with the onsen.io framework. But, when I updated to 2.0.0-rc.16 the map does not show initially. I can roll back to 2.0.0-rc.15 and the map does appear initially. I can’t figure out what is the culprit.

The HTML code follows:

ons-template(id="walking_geo")
  ons-page(ons-show="walking.onShowMap(main.store)" ons-destroy="walking.onDestroyMap()")
    div(id='walkMap')

and the javascript:

var vm = this;
vm.lat = ....; vm.lng = ....;
vm.onShowMap = function(store) {
  var mapElement = document.getElementById("walkMap");
  var latlng = new google.maps.LatLng(vm.lat, vm.lng);
  myOptions = {zoom: 13, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP}
  var map = new google.maps.Map(mapElement, myOptions);
  map.overlay = new google.maps.OverlayView();
  map.overlay.draw = function () { };
  map.overlay.setMap(map);
  map.geocoder = new google.maps.Geocoder();
  vm.map = map;
}

Any idea on what change caused this issue? Looking at the changes nothing pops out to me. I looked at the console logs and the other difference I see is in rc.15 there are a lot of tile gets (PNG) which do not appear in the rc.16. Any ideals on internal breakpoints to set within ONSEN?

Thanks,

Aaron

@argelius Thanks. I will for now move the JS declaration to the top.

I am working with OnsenUI 2.0.0-rc.4 with angular 1.4. I am trying to create a bare implementation of ons-splitter but I am receiving an “cannot read property ‘__animatorDict’ of undefined” at ons-splitter-side.js@442 where “animators: window.OnsSplitterElement._animatorDict”.

I verified that OnsSplitterElement property is undefined.

I reviewed the docs and cannot see a solution to these undefines. Is this an issue with how I am integrating angular1 with ons-splitter?

Thanks,

Aaron

My Jade source follows:

body(ng-controller="MainController as main")
        ons-splitter
            ons-splitter-side(var="menu" side="left" width="220px" collapse swipeable)
                ons-page
                    ons-list
                        ons-list-item(ng-click="main.onMenuClick('walking')" tappable)
                            | Walking
                        ons-list-item(ng-click="main.onMenuClick('lookup')" tappable)
                            | Lookup
                        ons-list-item(ng-click="main.onMenuClick('poll')" tappable)
                            | Poll
            ons-splitter-content(page="walking.html")
        ons-template(id="walking.html")
            ons-page
                ons-toolbar
                    div.left
                        ons-toolbar-button(ng-click="main.openMenu()")
                            ons-icon(icon="md-icon")
                    div.center
                        | Walking
                p
                    | Test
        ons-template(id="lookup.html")
            ons-page
                ons-toolbar
                    div.left
                        ons-toolbar-button(ng-click="main.openMenu()")
                            ons-icon(icon="md-icon")
                    div.center
                        | Lookup
                p
                    | Test
        ons-template(id="poll.html")
            ons-page
                ons-toolbar
                    div.left
                        ons-toolbar-button(ng-click="main.openMenu()")
                            ons-icon(icon="md-icon")
                    div.center
                        | Poll
                p
                    | Test

        //- Libraries
        script(src='/bower_components/OnsenUI/js/onsenui.js')
        script(src='/bower_components/angular/angular.js')
        script(src='/bower_components/OnsenUI/js/angular-onsenui.js')

        script(type='text/javascript').
            ons.bootstrap('main',[])
                .controller('MainController',['$http',function($http) {
                    var vm = this;
                }]);