24

結果をループするng-repeat要素があります$http.get()

<tr ng-repeat="blog in posts">
     <td style="text-align:center">{{ $index+1 }}</td>
     <td>{{ blog.title }}</td>
     <td>
         {{ blog.author.name }}
     </td>
     <td>
         {{ blog.created_at | date:'MMM-dd-yyyy' }}
     </td>
</tr>

私はMySQLデータベーステーブルとcreated_at同じです。timestampそして、私は使用してangular.js v1.0.7います。

db テーブルから同じ出力が得られますが、日付フィルターが機能していません。どうすればこれを解決できますか?

私のajax呼び出し、

$http({method: 'GET', url: 'http://localhost/app/blogs'}).
success(function(data, status, headers, config) {
    $scope.posts = data.posts;
}).
error(function(data, status, headers, config) {
    $scope.posts = [];
});
4

5 に答える 5

42

フィルターに渡される日付は、タイプ javascript Date である必要があります

blog.created_atフィルターなしで表示される値を確認しましたか?

バックアップされたサービスが日付を表す文字列を返しているとおっしゃいました。これは、次の 2 つの方法で解決できます。

  1. サーバー側コードが json 日付オブジェクトを返すようにする
    • サーバー側のコードが返す json をどのようにシリアル化するかを確認する
  2. 文字列の日付を受け入れ、必要な形式で日付を返す独自のフィルターを作成します
    • :独自のフィルターで角度フィルターを呼び出すことができます

次のように独自のフィルターを作成できます。

app.filter('myDateFormat', function myDateFormat($filter){
  return function(text){
    var  tempdate= new Date(text.replace(/-/g,"/"));
    return $filter('date')(tempdate, "MMM-dd-yyyy");
  }
});

テンプレートで次のように使用します。

<td>
  {{ blog.created_at | myDateFormat }}
</td>

返された配列をループしてからフィルターを適用するのではなく、

于 2013-10-29T09:02:05.367 に答える
15

サーバー側created_atからは、laravel eloquent から as 文字列を返します。

これは、このJavaScriptを使用して解決できます。

new Date("date string here".replace(/-/g,"/"));

だからコード、

$http({method: 'GET', url: 'http://localhost/app/blogs'}).
success(function(data, status, headers, config) {
   angular.forEach(data.posts, function(value, key){
     data.posts[key].created_at = new Date(data.posts[key].created_at.replace(/-/g,"/"));
   }
   $scope.posts = data.posts;
}).
error(function(data, status, headers, config) {
    $scope.posts = [];
});
于 2013-10-29T10:25:31.213 に答える
9

次のコードのように、文字列を日付に変換するカスタム フィルターを追加できます。

app.filter('stringToDate',function ($filter){
    return function (ele,dateFormat){
        return $filter('date')(new Date(ele),dateFormat);
    }
})

次に、このフィルターを任意のテンプレートで次のコードとして使用します。

<div ng-repeat = "a in data">{{a.created_at |stringToDate:"medium"}}</div>
于 2017-01-07T10:40:17.523 に答える
6

new Date(/*...*/)から取得したデータに基づいて$http.get、次のように作成できます。

$scope.date = new Date('2013', '10', '28'); // for example

とにかく、このデモは で見ることができますPlunker

それがあなたを助けることを願っています

于 2013-10-29T09:33:45.883 に答える
2

日付変数を記録するときは、次のように「new」キーワードを使用することを忘れないでください。

var time = new Date();

それ以外の場合は、次のように記述します。

var time = Date();

日付は関数として呼び出され、フィルターへの入力として使用できない日時文字列が返されます。

于 2015-02-02T06:00:14.617 に答える