0

This might be a stupid question as i am new to Laravel. I am making single page application using angular and laravel. i am trying to get all records from "todos" table and display them to todo.html on click of a "View all Todos" button. "View all Todos" goes to "localhost:8000/tasks" URL. When i click on that button i got all the todos fine no problem. But when i try to access that url directly on browser i got json array from laravel Todocontroller.

here is my route/web.php

Route::resource('/todo', 'TodoController');

Laravel TodoController controller 

 public function index()
{
    return Todo::all();
}

here is my angular code

myApp.config(['$routeProvider', '$locationProvider',

function ($routeProvider, $locationProvider) {
    $locationProvider.hashPrefix('');

    $routeProvider.when('/', {
        templateUrl: 'views/home.html',
    });
    $routeProvider.when('/todo', {
        templateUrl: 'views/todo.html',
        controller: 'todoController'
    });
    $locationProvider.html5Mode(true);

}]);

myApp.controller('taskController', function($scope, $http) {
$http({
    method: 'get',
    url: 'todo'
}).then(function (response) {
    $scope.about = response.data
},function (error){
    console.log(error, 'can not get data.');
});
});
Improve this question

2 Answers 2

Reset to default
1

You are targeting the same url from your angular controller as well as your Laravel controller. You are supposed to use Laravel as the API or service, while you allow angular do the routing. check this for more info. Laravel API routes

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

You mean i have to mentioned all routes in api.php?
i mean for you laravel routes, you can have a prefix of lets say api so your laravel routes have yourdomain.com/api/task and you angular controler can have yourdomain.com/task . That way, one you have more clearification.
Yes i got it. Thanks. But if i directly access the yourdomain.com/api/task in browser then i will still get json response. Is there any way to access laravel controllers directly from angular routes?
Okay. so in your angular controllers, you would use angular http and target the laravel url that returns the json response. so from what you have above, after you have changed the laravel route to api/task then in your angular controller, you use the $http and target the url _api/task_I hope i have been helpful.
0

Did you know you can also return Eloquent collections from your routes or controllers? They will automatically be converted to JSON. Give it a shot!

https://laravel.com/docs/5.5/responses

If you want to return html, use a view in your controller

public function index()
{   
    return view('todos')->with('todos',Todo::all());

}

https://laravel.com/docs/5.5/views

Improve this answer

1 Comment

Thanks for reply. But the purpose is not to return the json array. I want to display and html page contains html table with all todos instead of json array

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.