AngularJS不会显示（解析）与Laravel5中的$ http.get一起提供的数据 [英] AngularJS won't display (parse) data that is delivered with $http.get in Laravel5
问题描述
我有一个简单的SPA应用程序，只是为了 Laravel 5中数据库中的某些数据，以及前端我正在使用 AngularJS 。我的角度文件都在公共文件夹中。
I have a simple SPA application ,just to show some data from the database in Laravel 5 ,and for the front-end I'm using AngularJS . My angular files are all in public folder .
当我转到 localhost 而不是用户列表时，我确实知道这个
When i go to localhost instead of a list of users I get literally this
{{ user1.name }} , {{ user1.email }}
{{ user1.phone_number }}
以下是我的档案：
route.php
Route::get('/', 'PageController@index');
Route::group(['prefix' => 'api/v1'], function(){
Route::resource('jokes', 'User1Controller');
});
PageController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\User1 ;
use App\Http\Requests;
class PageController extends Controller
{
public function index()
{
return view('index');
}
}
User1Controller.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Response;
use App\User1 ;
class User1Controller extends Controller
{
public function index() {
return response()->json( User1::get() );
}
public function store(Request $request) {
User1::create([
'name' => $request->input('name'),
'email' => $request->input('email'),
'phone_number' => $request->input('phone_number')
]);
return response()->json(['success' => true]);
}
}
User1.php
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class User1 extends Model
{
protected $fillable = [
'name', 'email', 'phone_number'
];
}
resources / views / 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 -->
<script src="js/controllers/mainCtrl.js"></script> <!-- load our controller -->
<script src="js/services/commentServices.js"></script> <!-- load our service -->
</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>
public / js / app.js
angular.module('user1App', [
'controllers',
'services'
]);
angular.module('controllers', []);
angular.module('services', []);
public / js / controllers / mainCtrls.js
var Controller = angular.module('controllers');
Controller.controller('mainController', function($scope, $http, User1, $sce) {
// get all the comments first and bind it to the $scope.user1s object
User1.get()
.success(function(data) {
$scope.user1s = data;
});
});
public / js / services / user1Services.js
var Service = angular.module('services');
Service.factory('User1', function($http) {
return {
get : function() {
return $http.get('api/v1/jokes');
}
};
});
我看了数据库，在localhost / api / v1 /笑话上有一些用户，因为我使用Postman检查了
推荐答案
要达到预期的结果，请使用以下选项
To achieve expected result , use below option
angular.module('user1App', []);
angular.module('user1App').controller('mainController', function($scope, $http, User1, $sce) {
$http.get('api/v1/jokes').success(function(data) {
$scope.user1s = data;
});
}
这篇关于AngularJS不会显示（解析）与Laravel5中的$ http.get一起提供的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
