Search code examples
angularjscordovaonsen-ui

Unable to run angular js code with onsen cordova


I want to run a simple Angular js code but I am not able to do it in Cordova with Onsen ui

I am getting an error link below :

https://docs.angularjs.org/error/ng/areq?p0=HelloCtrl&p1=not%20a%20function,%20got%20undefined

I am referring this page :

https://onsen.io/blog/onsen-ui-tutorial-angularjs-essentials-for-using-onsen-ui-part-1/

Using Onsen 1

p1.html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
<meta http-equiv="Content-Security-Policy"/>
<link href="css/bootstrap.min.css" rel="stylesheet"> 
<link rel="stylesheet" href="css/onsenui.css">
<link rel="stylesheet" href="css/onsen-css-components.css">
<link rel="stylesheet" href="css/sliding_menu.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
<script src="js/jquery.js"></script> 
<script src="js/bootstrap.min.js"></script>
<script src="js/angular/angular.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>

 <script>

 ons.bootstrap();

 var myApp = angular.module('myApp',[]);

 myApp.controller('HelloCtrl', function($scope){
     $scope.name = "Onsen UI!";
 });

</script>
</head>
<body ng-app="myApp">
<div ng-controller="HelloCtrl">
<input type="text" ng-model="name">
<p>Hello {{name}}</p>
</div> 
</body>
</html>

Output :

enter image description here

Error :

enter image description here

Below is my Directory structure :

enter image description here


Solution

  • Solved It...

    Actually when I installed jquery I copied only the jquery.js file from the jquery folder into my js folder but now I copied the whole jquery folder into the js folder and It executed successfully...

    Thanks for your support guys.