Unable to run angular js code with onsen cordova

2019-09-10 07:35发布

问题:

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 :

Error :

Below is my Directory structure :

回答1:

You will have to include jQuery in your project, this is what the error is all about.

Error: Bootstrap's Javascript requires jQuery

Also make sure to load jquery.js file before loading bootstrap



回答2:

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.