I'm having troubles referencing my angularJS files in Laravel's "public" folder. My public folder structure looks like this::
public
-css
-js
-services
-controllers
-app.js
I have my "index.php" file inside the "app/views" folder.When i go to the home page of my application http://localhost, the browser brings me to the index.php file as expected.
Inside my "index.php" file, i want to reference my javascript files under the "public/js" and I get "GET http://localhost/js/app.js 404 (Not Found)" - in the browser console meaning that those files can't be found. These are some of the options i have tried to include them in the "index.php" file:
1. <script src="js/app.js"></script>
and
EDIT:
<script src="<?php echo asset('/js/app.js'); ?>">
<script src="<?= url('js/app.js') ?>">
and
- I have tried to move the js/app.js to folders resources or resources/views .
- I have tried to move just the app.js to resources/views
All these options don't find the files under the "public" folder. I don't use BLADE
My files look like :
index.php
<!DOCTYPE html>
<html lang=eng>
<head>
<meta charset="UTF-8">
<title>Welcome </title>
<!-- CSS -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css"> <!-- load bootstrap via cdn -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css"> <!-- load fontawesome -->
<style>
body { padding-top:30px; }
/* form { padding-bottom:20px; }
*/ </style>
<!-- JS -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="js/app.js">
</script> <!-- load our application --><!-- load our application -->
</head>
<body class="container" ng-app="user1App" ng-controller="mainController">
<div class="user1" ng-repeat="user1 in user1s">
<h3> <small>{{ user1.name }} , {{ user1.email }}</small></h3>
<p>{{ user1.phone_number }}</p>
</div>
</body>
</html>
app.js
angular.module('user1App', [
]);
angular.module('user1App').controller('mainController', function($scope, $http, User1, $sce) {
$http.get('api/v1/jokes').success(function(data) {
$scope.user1s = data;
});
}
My config/view.php looks like :
'paths' => [
realpath(base_path('resources/views')),
],
For more information about my code look here AngularJS won't display (parse) data that is delivered with $http.get in Laravel5
ERROR in console :
GET http://localhost/js/app.js 404 (Not Found)
.htaccess
<IfModule mod_rewrite.c>
<IfModule mod_negotiation.c>
Options -MultiViews
</IfModule>
RewriteEngine On
# Redirect Trailing Slashes If Not A Folder...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/$ /$1 [L,R=301]
# Handle Front Controller...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.php [L]
# Handle Authorization Header
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
</IfModule>
Please help ,I'm realy not seeing the problem and can't google it anywhere.
Thanks