Problem with ons.ready ...

FranciscoValdes

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

<!DOCTYPE html>

<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” />

<script src=“scripts/platformOverrides.js”></script>
<script src=“lib/angular/angular.js”></script>
<script src=“lib/onsen/js/onsenui.js”></script>

<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” />

<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>

CNaik

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

Regards,
CNaik.

Fran Diox

@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.

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Problem with ons.ready ...