Problem with ons.ready ...



  • Hi, I have a problem with ons.ready, this doesn’t load, the following is my code:

    <!DOCTYPE html>
    <!-- CSP support mode (required for Windows Universal apps): https://docs.angularjs.org/api/ng/directive/ngCsp -->
    <html lang=“en” ng-app=“app” ng-csp>
    <head>
    <meta charset=“utf-8” />
    <meta name=“apple-mobile-web-app-capable” content=“yes” />
    <meta name=“mobile-web-app-capable” content=“yes” />
    <!-- JS dependencies (order matters!) -->
    <script src=“scripts/platformOverrides.js”></script>
    <script src=“lib/angular/angular.js”></script>
    <script src=“lib/onsen/js/onsenui.js”></script>
    <!-- CSS dependencies -->
    <link rel=“stylesheet” href=“lib/onsen/css/onsenui.css” />
    <link rel=“stylesheet” href=“lib/onsen/css/onsen-css-components.css” />
    <link rel=“stylesheet” href=“lib/onsen/css/onsen-css-components-blue-basic-theme.css” />
    <!-- CSP support mode (required for Windows Universal apps) -->
    <link rel=“stylesheet” href=“lib/angular/angular-csp.css” />
    <script src=“lib/jquery/jquery-2.1.4.min.js”></script>
    <script src=“scripts/index.js”></script>

    <!-- --------------- App init --------------- -->
    <title>Onsen UI Sliding Menu</title>
    <script>
        angular.module('app', ['onsen']);
        ons.bootstrap();
        ons.ready(function () {
            alert('hola');
            var content = document.getElementById('content');
            content.innerHTML = "<ons-button>Another button</ons-button>";
        });
        
    </script>


  • @FranciscoValdes you may need to call ons.compile(content); as last statement in ons.ready(…).

    Regards,
    CNaik.


  • Onsen UI

    @FranciscoValdes , @CNaik is right, for AngularJS you need to compile the new elements after attaching them.

    Also, either remove angular.module('app', ['onsen']); + ng-app=“app” or ons.bootstrap(). You are bootstrapping twice. Read this for more information.


Log in to reply