Question

我只能使用title和body属性获取数据，但是当我获取名称的数据时，当我刷新页面时它显示为空，但是当我自动提交时显示。

由于某种原因，angularjs未成功检索名称。

注意：我正在使用laravel。

例如：

这是服务器端：

PostController中

public function getPosts() {

  $posts = Post::with('user')->get();
  $response = new Response(json_encode($posts));
  $response->headers->set('Content-Type', 'application/json');
  return $response;
}

public function storePost(Request $request) {
  $data = request()->validate([
    'title' => 'required|max:120',
    'body' => 'required|max:1000'
  ]);

  $data['user_id'] = auth()->user()->id;
  $data['name'] = auth()->user()->name;

  $post = Post::create($data);

  $response = new Response(json_encode($data));
  $response->headers->set('Content-Type', 'application/json');


  // return redirect('/home')->withMessage('A new post was created.');

  return $response;
}

main.js

$scope.myposts = {};

$scope.addPost = function() {

  $http.post('/auth/post', {
    title: $scope.post.title,
    body: $scope.post.body

  }).then(function(data, status, headers, config) {
    console.log(data);
    $scope.myposts.push(data.data);

  });

  $scope.post.title = '';
  $scope.post.body = '';

};

$scope.deletePost = function(post) {
  var index = $scope.myposts.indexOf(post);

  if (index != -1) {
    $scope.myposts.splice(index, 1);
  }

  $http.delete('auth/post/' + post.id);
};

$scope.getPosts = function() {

  $http.get('/auth/posts').then(function(data) {
    $scope.myposts = data.data;
  }).then(function(data, status, header, config) {});
};

HTML：

<div id="mypost" class="col-md-8 panel-default" ng-repeat="post in myposts">
  <div id="eli-style-heading" class="panel-heading">
    <% post.title %>
  </div>
  <div class="panel-body panel">
    <figure>
      <p>
        <% post.body %>
      </p>
      by:
      <p>
        <% post.user.name %>
      </p>

    </figure>
    <span><button ng-click="deletePost(post)">x</button></span>
  </div>
</div>

当我第一次添加内容而不刷新（异步）时

页面刷新

以上（不同帖子的不同日志）

Answer 1

您的重新加载页面没有问题，因为

$posts = Post::with('user')->get();

返回

{
    "title": "title",
    "body": "body",
    "user":  {
        "name": "name"
    }
}

并在您的角度中显示

<% post.user.name %>

因此，添加时显示它的解决方案是在推送到数组

之前重构json对象

$scope.addPost = function() {

  $http.post('/auth/post', {
    title: $scope.post.title,
    body: $scope.post.body

  }).then(function(data, status, headers, config) {
    console.log(data);

    data.data['user'] = {
        name: data.data.name
    }

    $scope.myposts.push(data.data);

  });

  $scope.post.title = '';
  $scope.post.body = '';

};

Laravel如何使用angular使用user_id检索名称？

1 个答案: