片刻js使用laravel在heroku上无效日期

时间:2017-11-25 23:54:00

标签: angularjs laravel momentjs

我正在使用laravel和moment.js而且我正在

  

无效日期

看看

注册并发帖

http://morning-depths-45941.herokuapp.com

每当我在heroku上发帖并渲染post.created_at时。它在我的mamp上本地工作,但是当我异步发布一个帖子时它会显示无效的日期,但是在刷新时它会在本地打印正确的时间。

在heroku上,即使刷新也只显示无效日期。

在heroku我的控制台上读取以下内容:

控制台

{body: "adadadad", user_id: 1, name: "Tim", created_at: null, user: {…}, …}

以下是我用html

开头的代码

HTML

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


        <figure>
            <p ng-model="post.body" editable-text="post.body" e-form="textBtnForm"> <% post.body %></p>
            <p>   <% post.created_at | phpDate : "human" %></p>
        </figure>
        <span>

         <i style="color:red;" class="glyphicon glyphicon-remove" ng-click="deletePost(post)" ng-if="post.deletable"></i>


              <button ng-if="post.update" class="btn btn-default" ng-click="textBtnForm.$show()" ng-hide="textBtnForm.$visible">
                Edit
              </button>

            <span><button ng-if="post.update" type="submit" class="btn btn-primary" ng-click="updatePost(post)">Update</button></span>
        </span>
    </div>
</div>

moment.js的主要脚本突出显示创建帖子和过滤器

var app = angular.module('eli', ["xeditable", 'angularMoment']);

app.config(function($interpolateProvider) {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});



app.run(function(editableOptions) {
  editableOptions.theme = 'bs3';
});


app.filter('phpDate', function() {
    return function(input, format) {


        if (format == "human") {
            // Special case for formatting. If user asks for "human" format
            // return a value like "13 minutes ago" or "2 weeks ago" etc.
            return moment(input).startOf(input).fromNow(); 
        } else {
            // Covert the moment to a string using the passed format
            // If nothing is passed, uses default JavaScript date format
            return moment(input).startOf(input).fromNow(); 
        }
    };
});

app.controller('mainCtrl', ['$scope', '$filter', '$http', function($scope, $filter,  $http){



    $scope.myposts = [];

    $scope.addPost = function(){

        $http.post('/auth/post', {
            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.body = '';


    };

最后我的服务器方面的事情

PostController.php

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

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



    $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;
}

1 个答案:

答案 0 :(得分:1)

从HTML代码中只需将日期(使用自定义过滤器)部分更改为:

<p>   <% post.user.created_at | phpDate : "human" %></p>

保持其他一切相同&amp;它应该工作。

<强>更新

根据当地时区显示正确的时间。此外,为了添加新帖子,它再次导致问题,因此将addPost方法从控制器更改为:

$scope.addPost = function(){    
    $http.post('/auth/post', {
        body: $scope.post.body, 
    }).then(function(data, status, headers, config){
        console.log(data);  
        data.data['user'] = {
            name: data.data.name,
            created_at: moment().format("YYYY-MM-DD HH:mm:ss");
        },

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

    });

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

这里我只将created_at属性添加到用户对象,其值为当前时间。所以新添加的将显示正确的时间(使用该自定义过滤器)