Angular.js формат даты с объекта json
Мой ответ json выглядит следующим образом:
[{"Id":"dab4580b-e24d-49f8-9fd5-2e968b10d3b5","Title":"MVVM-Sidekick 入精","CreatedOn":"\/Date(1390272893353)\/","IsChecked":false},{"Id":"66a0f134-e240-4cc4-96fa-ac3807853ca7","Title":"Windows Phone 开发入精","CreatedOn":"\/Date(1390018447080)\/","IsChecked":false}]
дата "CreatedOn" находится в таком формате: '/Date (1390272893353)/'
когда я привязываю этот результат к таблице html, дату нельзя отформатировать:
<td>{{item.CreatedOn | date: 'yyyy-MM-dd HH:mm'}}</td>
все еще дает мне:
/Дата (1390272893353)/
Я не хочу менять какой-либо код на стороне сервера (не изменяйте строку json), что лучший способ отформатировать эту дату?
Ответы
Ответ 1
Один из вариантов - записать другой фильтр и поместить его в цепочку. Например:.
app.filter("mydate", function() {
var re = /\/Date\(([0-9]*)\)\//;
return function(x) {
var m = x.match(re);
if( m ) return new Date(parseInt(m[1]));
else return null;
};
});
В основном он использует регулярное выражение для синтаксического анализа строки и делает Date
(если формат отличается от того, который показан, вам придется настроить регулярное выражение).
Используйте его как:
<td>{{item.CreatedOn | mydate | date: 'yyyy-MM-dd HH:mm'}}</td>
Ответ 2
Я на самом деле объединил ответы от @Charminbear и @Nikos, которые попадают в этот фильтр, который работает довольно хорошо и довольно ясен без регулярного выражения:
myApp.filter("jsDate", function () {
return function (x) {
return new Date(parseInt(x.substr(6)));
};
});
Это позволяет написать
{{ $scope.item.CreatedOn | jsDate | date:"yyyy-MM-dd" }}
Ответ 3
Дата-фильтр Angular ожидает JS-Date. Поэтому вам нужно разобрать дату JSON, прежде чем передавать его фильтру.
Попробуйте следующее:
<td>{{item.CreatedOnParsed | date: 'yyyy-MM-dd HH:mm'}}</td>
И в вашем обратном методе ответа сделайте что-то вроде:
$scope.item.CreatedOnParsed = new Date(parseInt(item.CreatedOn.substr(6)));
как показано в этом Ответ
ИЗМЕНИТЬ
Как видно из комментариев вашего сообщения, даже для метки даты достаточно только отметки времени, поэтому даже этого должно быть достаточно:
$scope.item.CreatedOnParsed = item.CreatedOn.substr(6);
Ответ 4
Я знаю, что опаздываю на вечеринку. Но я хочу сказать, что помогло мне: -
<td>{{item.yourdatefield.slice(6,-2) | date:'dd-MMM-yyyy' }}</td>
Надеюсь, что это поможет ленивым кодерам, таким как Я.:)
Ответ 5
//input - "DocDate":"\/Date(1127318400000-0000)\/"
-------
<tr dir-paginate="user in SalesOrder>
<td>{{user.DocDate | jsonDate}}</td>
</tr>
controller
----------
app.filter('jsonDate', ['$filter', function ($filter) {
return function (input, format) {
return (input)
? $filter('date')(parseInt(input.substr(6)), format)
: '';
};
}]);
Ответ 6
Другим, возможно, лучшим вариантом является анализ даты, когда вы получаете JSON.
Я использую следующую функцию:
(function() {
if (JSON && !JSON.parseWithDate) {
JSON.parseWithoutDate = JSON.parse; //Store the original JSON.parse function
var reISO = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)Z$/;
var reMsAjax = /^\/Date\((d|-|.*)\)[\/|\\]$/;
JSON.parseWithDate = function (json) {
/// <summary>
/// parses a JSON string and turns ISO or MSAJAX date strings
/// into native JS date objects
/// </summary>
/// <param name="json" type="var">json with dates to parse</param>
/// </param>
/// <returns type="value, array or object" />
try {
var res = JSON.parseWithoutDate(json,
function (key, value) {
if (typeof value === 'string') {
var a = reISO.exec(value);
if (a)
return new Date(Date.UTC(+a[1], +a[2] - 1,
+a[3], +a[4], +a[5], +a[6]));
a = reMsAjax.exec(value);
if (a) {
var b = a[1].split(/[-+,.]/);
return new Date(b[0] ? +b[0] : 0 - +b[1]);
}
}
return value;
});
return res;
} catch (e) {
// orignal error thrown has no error message so rethrow with message
throw new Error("JSON content could not be parsed");
return null;
}
};
JSON.dateStringToDate = function (dtString) {
/// <summary>
/// Converts a JSON ISO or MSAJAX string into a date object
/// </summary>
/// <param name="" type="var">Date String</param>
/// <returns type="date or null if invalid" />
var a = reISO.exec(dtString);
if (a)
return new Date(Date.UTC(+a[1], +a[2] - 1, +a[3],
+a[4], +a[5], +a[6]));
a = reMsAjax.exec(dtString);
if (a) {
var b = a[1].split(/[-,.]/);
return new Date(+b[0]);
}
return null;
};
JSON.stringifyWcf = function (json) {
/// <summary>
/// Wcf specific stringify that encodes dates in the
/// a WCF compatible format ("/Date(9991231231)/")
/// Note: this format works ONLY with WCF.
/// ASMX can use ISO dates as of .NET 3.5 SP1
/// </summary>
/// <param name="key" type="var">property name</param>
/// <param name="value" type="var">value of the property</param>
return JSON.stringify(json, function (key, value) {
if (typeof value == "string") {
var a = reISO.exec(value);
if (a) {
var val = '/Date(' +
new Date(Date.UTC(+a[1], +a[2] - 1,
+a[3], +a[4],
+a[5], +a[6])).getTime() + ')/';
this[key] = val;
return val;
}
}
return value;
})
};
//Make Date parsing the default
JSON.parse = JSON.parseWithDate;
}
})();
Что взято здесь: http://codepaste.net/i89xhc, за исключением того, что я перезаписываю стандартную функцию JSON.parse с этой версией, которая анализирует дату. Это означает, что Angular будет автоматически анализировать даты ASMX со всех JSON, которые он видит.
Вы также можете написать настраиваемое преобразование с помощью преобразований Angular $http. Смотрите: https://docs.angularjs.org/api/ng/service/ $http
Ответ 7
Предполагая, что это дата .net JSON, и вы используете moment.js. Затем используйте его функциональность (определенную здесь) в фильтр
myApp.filter('JSONdate', [
'$filter', function ($filter) {
return function (input, appformat) {
if (input != null) {
return moment(input).format(appformat);
// use the line below if you want to leverage the standard date filter on top of this
// return $filter('date')(new Date(moment(input)), appformat);
} else {
return '';
}
};
}])