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.
-
@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”
orons.bootstrap()
. You are bootstrapping twice. Read this for more information.