Php Angular/Laravel-从mysql数据库输出json数据_Php_Mysql_Angularjs_Laravel_Laravel 5

Php Angular/Laravel-从mysql数据库输出json数据

php mysql angularjs laravel laravel-5

Php Angular/Laravel-从mysql数据库输出json数据,php,mysql,angularjs,laravel,laravel-5,Php,Mysql,Angularjs,Laravel,Laravel 5,我正在获取数据，我想用laravel query builder从mysql中输出数据，并将其转换为JSON格式，正如W3所建议的那样然后用AngularJS帮助打印获取的mysql数据，但它似乎什么都不做，它显示了一个空白页面 Laravel路线 Route::get('/' , [ 'as' => 'homepage', 'uses' => 'indexController@main' ]); IndexController class IndexContr

我正在获取数据，我想用laravel query builder从mysql中输出数据，并将其转换为JSON格式，正如W3所建议的那样然后用AngularJS帮助打印获取的mysql数据，但它似乎什么都不做，它显示了一个空白页面

Laravel路线

Route::get('/' ,  [
    'as' => 'homepage',
    'uses' => 'indexController@main'
]);

IndexController

class IndexController extends Controller
{
    public function main(){
      $data =  json_encode(array('user_posts' =>\DB::table('posts')
                ->orderBy('added_on', 'desc')
                ->get()));

    return view('index', ['posts' => $data]);
    }

}

<head>

            <!--Angulare -->
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.js"></script>
            <!--Applicazione -->
            <script src="js/app.js"></script>
            <script src="js/controller/PoolController.js"></script>
            <script src="js/service/poolService.js"></script>
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    </head>

    <body>
      <div ng-app="myApp" ng-controller="customersCtrl">

      <table>
        <tr ng-repeat="x in names">
          <td>{{ x.username }}</td>
          <td>{{ x.age }}</td>
        </tr>
      </table>

      </div>





   ### Angular Module and controller ###
      <script>
      var app = angular.module('myApp', []);
      app.controller('customersCtrl', function($scope, $http) {
          $http.get("/")
          .then(function (response) {$scope.names = response.data.user_posts;
          });
      });
      </script>
    </body>

带有AngularJS控制器的index.php视图

class IndexController extends Controller
{
    public function main(){
      $data =  json_encode(array('user_posts' =>\DB::table('posts')
                ->orderBy('added_on', 'desc')
                ->get()));

    return view('index', ['posts' => $data]);
    }

}

<head>

            <!--Angulare -->
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.js"></script>
            <!--Applicazione -->
            <script src="js/app.js"></script>
            <script src="js/controller/PoolController.js"></script>
            <script src="js/service/poolService.js"></script>
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    </head>

    <body>
      <div ng-app="myApp" ng-controller="customersCtrl">

      <table>
        <tr ng-repeat="x in names">
          <td>{{ x.username }}</td>
          <td>{{ x.age }}</td>
        </tr>
      </table>

      </div>





   ### Angular Module and controller ###
      <script>
      var app = angular.module('myApp', []);
      app.controller('customersCtrl', function($scope, $http) {
          $http.get("/")
          .then(function (response) {$scope.names = response.data.user_posts;
          });
      });
      </script>
    </body>

到目前为止，我已经在AngularJS控制器中进行了尝试：

Route::get('/' ,  [
    'as' => 'homepage',
    'uses' => 'indexController@main'
]);

更改：

 $http.get("/")

与

也试着改变

response.data.user_posts

与

基本上我有点迷路了，似乎不明白我做错了什么。

提前感谢

您总是返回一个渲染视图，它永远不会是一个有效的JSON响应。相反，检查它是否是ajax请求。此外，Laravel还提供了

collection（）

，在可能的情况下，应该使用它来支持原始数组或json编码，以提供堆栈内聚。试试这个：

if ($request->ajax()) {
    return response()->json(collect(['user_posts' =>\DB::table('posts')
        ->orderBy('added_on', 'desc')
    ]));
}

return view('index);

另外，确保正在将

$request

注入控制器的方法：

public function main(Request $request) {

此外，

Angular

不知道拉威尔的路线，但没关系。如果您直接在视图文件中使用脚本，您仍然可以访问Laravel的帮助程序，您可以发出端点请求：

$http.get('{{route('homepage')}}')

否则，如果您的Angular在脚本中，只需执行以下操作：

$http.get('/');

您将在HTTP请求回调中使用

响应来访问它。用户发布

您可以使用$routeProvider而不是$html，如下所示：

app.config(['$routeProvider', function($routeProvider) {

    $routeProvider.
    when('/homepage', {
        templateUrl: '/homepage.html',
        controller: 'customersCtrl'
      });

}]);

当我检查ajax请求是否存在时，它会说false，并且只返回视图，但是如何准确地输出从查询中获得的数据呢？我现在很困惑，说实话，拉威尔和Angular是如何工作的。。。