I went through all similiar questions, and I didn't find any solution. My code:
test.php
<html xmlns:ng="http://angularjs.org/">
<head>
<script type="text/javascript" src="/assets/js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="/assets/bootstrap-4.6.0/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="/assets/angular-1.8.2/angular.js"></script>
<script type="text/javascript" src="/assets/angular-1.8.2/angular-route.js"></script>
<script type="text/javascript" src="/assets/angular-1.8.2/angular-resource.js"></script>
<script type="text/javascript" src="/assets/angular-1.8.2/angular-sanitize.js"></script>
<script type="text/javascript" src="/assets/angular-1.8.2/angular-cookies.js"></script>
<script type="text/javascript" src="/assets/js/test.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl" >
First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{firstName + " " + lastName}}
</div>
</body>
</html>
test.js :
$(document).ready( function (){
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstName= "John";
$scope.lastName= "Doe";
})
});
The error Im getting in console:
angular.js:138 Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
So, I went through the forums and everything. So far, I load the angular when the document is ready, the script tags are closed, the controler and app is defined with dependencies array. I still get the error tho. What am I doing wrong?
Thank you for advice.