MVC日期格式化,后台使用Newtonsoft.Json序列化日期,前端使用”f”格式化日期

MVC控制器中,经常使用Newtonsoft.Json把对象序列化成json字符串传递到前端视图。当对象中有DateTime类型的属性时,前后台如何处理才能把DateTime类型转换成想要的格式呢?

 

有这样的一个类具有DateTime类型属性:

using System;
 
namespace MvcApplication1.Models
{
    public class Sample
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public DateTime Date { get; set; }
    }
}

 

控制器中使用Newtonsoft.Json把对象实例序列化成json字符串:

using System.Web.Mvc;
using MvcApplication1.Models;
using Newtonsoft.Json;
using Newtonsoft.Json.Converters;
 
namespace MvcApplication1.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            var sample = new Sample()
            {
                Id = 1,
                Name = "good",
                Date = DateTime.Now
            };
 
            JsonSerializerSettings microsoftDateFormatSettings = new JsonSerializerSettings
            {
                 DateFormatHandling = DateFormatHandling.MicrosoftDateFormat,
                 DateTimeZoneHandling = DateTimeZoneHandling.Utc
            };
            ViewData["json"] = Newtonsoft.Json.JsonConvert.SerializeObject(sample, microsoftDateFormatSettings);
            return View();
        }
 
    }
}
 

前台视图使用一个叫"f"的js文件,把json中的日期格式转换成期望的样子:

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<p>
    <span id="jsonDate">@ViewData["json"]</span>
</p>
 
<p>
    转换后的时间格式为:<span id="fDate"></span>
</p>
 
@section scripts
{
    <script src="~/Scripts/date.f-0.5.0.js"></script>
    <script type="text/javascript">
        $(function () {
           
            var obj = $.parseJSON($('#jsonDate').text());
            //$('#fDate').text(new Date(parseInt(obj.Date.substr(6))).f("yyyy-MM-dd HH:mm:ss"));
            $('#fDate').text(new Date(parseInt(obj.Date.substr(6))).f("yyyy-MM-dd"));
        });
    </script>
}
 

结果:

1

 

参考资料:
关于"f" 的js文件:http://fisforformat.sourceforge.net/
关于Newtonsoft.Json:http://james.newtonking.com/json/help/index.html?topic=html/DatesInJSON.htm

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/449779.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Google Go Programming In Eclipse

http://www.tutorialsavvy.com/2013/04/google-go-programming-in-eclipse.html/ Google Go Programming In Eclipse The new “Go” programming language is from Google co.It has many features better then other languages.Go language features are:-– High Speed Comp…

pycharm打开ipynb显示为文本格式解决办法

然后进入 添加类型 jupyter notebook 然后下方添加 *.ipynb

[基础篇]ESP32-RTOS-SDK教程(一)之Windows环境搭建

当下正是物联网最好的时代&#xff0c;学习新的技术怎么能只学习ESP8266呢&#xff1f;要知道ESP8266还有一个孪生兄弟呢&#xff0c;最重要的是这个孪生兄弟要比ESP8266是更厉害的&#xff0c;所以我们也是非常有必要学习一下的&#xff0c;其实这篇文章去年就已经写了&#x…

安卓系统上的远程 JS 调试 Remote JavaScript Debugging on Android

每当在 Android 移动设备上调试网页时&#xff0c;开发人员往往都会不自觉陷入调试的泥潭中去。《Android开发指南》提供了一个解决方案&#xff0c;却有点繁琐复杂。因此&#xff0c;许多 Web 开发人员会倾向于使用类似 Firefox Firebug 的或像 WebKit 的 Web Inspector 之类的…

SEO艺术

SEO艺术 编辑推荐 在本书中&#xff0c;四位搜索引擎优化&#xff08;SEO&#xff09;领域最受瞩目的专家阐述了制订以及执行一个完善的SEO策略时应遵循的一些实用指南与最新技术。 基本信息 原书名&#xff1a; The Art of SEO原出版社&#xff1a; OReilly作者&#xff1a; (…

http状态码301和302详解及区别

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 一直对http状态码301和302的理解比较模糊&#xff0c;在遇到实际的问题和翻阅各种资料了解后&#xff0c;算是有了一定的理解。这里记录下…

哪些编程语言需要修复?

摘要&#xff1a;编程语言有十全十美的吗&#xff1f;每种语言都有缺陷吗&#xff1f;这不&#xff0c;Java、C、C、Python都中枪了。语言之间也可相互“掐架”&#xff0c;一起来看下。 原文作者Kevin Kelleher采用一种比较新颖的方式来比较编程语言&#xff1a;即描述每个编程…

Python标准库

《Python标准库》基本信息原书名&#xff1a; The Python Standard Library by Example 原出版社&#xff1a; Pearson Education 作者&#xff1a; (美)Doug Hellmann 译者&#xff1a; 刘炽 出版社&#xff1a;机械工业出版社 ISBN&#xff1a;9787111378105上架时间&#xf…

Perl迎来25岁生日

摘要&#xff1a;Perl迎来了它的第25岁生日&#xff0c;普天下Perlist都冒泡同庆一下&#xff0c;很多开发者喜欢它的理由是因其具备强力、稳定、成熟、可移植性等特点&#xff0c;Perl的爱好者们赶快送上你的祝福吧&#xff01; 昨天&#xff0c;Perl迎来了它的第25岁生日&…

20165114 《网络对抗技术》 Exp0 Kali安装与配置 Week1

目录&#xff1a; 一、kail的下载与安装 二、kali的网络设置 三、安装vmware-tools。 四、更新软件源。 五、共享文件夹 六、安装中文输入法 一、kail的下载与安装 VMware workstation的安装 因为之前的课程已经涉及&#xff0c;所以本机已经安装好了VMware workstation&#x…

大数据:互联网大规模数据挖掘与分布式处理

《大数据:互联网大规模数据挖掘与分布式处理》基本信息原书名&#xff1a;Mining of Massive Datasets作者&#xff1a; (美)拉贾拉曼(Rajaraman,A.) (美)厄尔曼(Ullman,J.D.) [作译者介绍]译者&#xff1a; 王斌丛书名&#xff1a; 图灵程序设计丛书出版社&#xff1a;人民邮电…

SpringCloud框架搭建+实际例子+讲解+系列五

&#xff08;4&#xff09;服务消费者&#xff0c;面向前端或者用户的服务 本模块涉及到很多知识点&#xff1a;比如Swagger的应用&#xff0c;SpringCloud断路器的使用&#xff0c;服务API的检查、token的校验&#xff0c;feign消费者的使用。大致代码框架如下&#xff1a; 先…

软件开发者最重要的四大技能

摘要&#xff1a;现如今&#xff0c;可供选择的技术、语言及平台可谓五花八门&#xff0c;因此要弄明白哪里是花时间训练的最佳投资点也就难上加难…… 现如今&#xff0c;可供选择的技术、语言及平台可谓五花八门&#xff0c;因此作为软件开发者&#xff0c;要弄明白哪里是花时…

Java 12 将于3月19日发布,8 个最终 JEP 一览

开发四年只会写业务代码&#xff0c;分布式高并发都不会还做程序员&#xff1f; JDK 12 已于2018年12月进入 Rampdown Phase One 阶段&#xff0c;这意味着该版本所有新的功能特性被冻结&#xff0c;不会再加入更多的 JEP 。该阶段将持续一个月&#xff0c;主要修复 P1-P3 级…

股票期货数据的resample处理

​ import pandas as pd stock_day pd.read_csv("stock_day.csv") stock_day stock_day.sort_index() # 对每日交易数据进行重采样 &#xff08;频率转换&#xff09; stock_day.index# 1、必须将时间索引类型转换成Pandas默认的类型 stock_day.index pd.to_datet…

程序员如何做出“不难看”的设计

摘要&#xff1a;程序员在写代码的时候往往只注重功能的实现和性能的提升&#xff0c;忽视了外观和易用性&#xff0c;其实很多时候只要注意一些基本的规则&#xff0c;就可以大幅度提高产品的观感。 经常看到程序员展示自己做的东西&#xff0c;有一些是创业项目&#xff0c;有…

微服务实战(二):使用API Gateway

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 当你决定将应用作为一组微服务时&#xff0c;需要决定应用客户端如何与微服务交互。在单体式程序中&#xff0c;通常只有一组冗余的或者…

五步让你成为专家级程序员

摘要&#xff1a;Mark Lassoff是一位高级技术培训师&#xff0c;从事培训工作已有10余年。他培训的客户包括美国国防部、Lockheed Martin等。在多年的培训生涯中&#xff0c;他总结了一些如何快速学习一门语言的技巧&#xff0c;这些技巧非常简单&#xff0c;但是却让人受益匪浅…

Laravel 使用 Aliyun OSS 云存储

对象存储 ( Object Storage Service, 简称 OSS ) OSS 相信大家都听过, 它是阿里云对外提供的海量, 安全和高可靠的云存储服务. 大家可以把自己网站的资源存上面加快自己网站速度, aliyun 官网也有文档不过对于新手来说有点难, 那么这里我给大家推荐一个组件和组件的使用. johnl…

在线学习新编程 技巧全攻略

摘要&#xff1a;有句俗语叫&#xff1a;“技多不压身”&#xff0c;如果你有时间和兴趣&#xff0c;不妨多了解和掌握编程技能&#xff0c;或许随时可能有用。本文为你收集了一些编程技巧&#xff0c;让你轻松学编程。 有句俗语叫&#xff1a;“技多不压身”&#xff0c;如果你…