# Date formatting with Moment from data

**URL:** <https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618>\
**Category:** How-to Discussions\
**Created:** [June 3, 2017, 4:27pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618 "2017-06-03T16:27:56Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 3, 2017, 4:27pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/1 "2017-06-03T16:27:56Z")

</div>

The view:

![file](https://s3.us-east-2.amazonaws.com/fuse-legacy-forum-assets/j0nnwlSNi3YW-image-1496507147614.png)

```auto
<Rectangle Height="1" Color="#888888" Margin="0,25,0,0" Opacity="0.2" />
<DockPanel Alignment="VerticalCenter">
    <Circle Dock="Left" Width="40" Height="40">
        <ImageFill Url="{portrait}" StretchMode="UniformToFill" />
    </Circle>
    <StackPanel Padding="16,0" Alignment="VerticalCenter">
        <MutedText Value="{author}" FontSize="14" Alignment="Left" />
        <MutedText Value="{published_at}" FontSize="12" Alignment="Left" />
    </StackPanel>
</DockPanel>
<MutedText Margin="0,20,0,0">Last Updated: {updated_at.date} by {editor}</MutedText>

```

How would I format the date in the data with Moment?

---

<div class="post-metadata">

**Author:** ![Clay](https://avatars.discourse-cdn.com/v4/letter/c/65b543/32.png) [@Clay](https://forums.fusetools.com/u/Clay)\
**Post date:** [June 3, 2017, 4:42pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/2 "2017-06-03T16:42:48Z")

</div>

in your `.uniproj` file Include `"js/moment.js:Bundle"` then in your javascript

```auto
var Moment = require("js/moment.js");

```

Now it’s ready to use. You just need to generate the date values with moment library where it’s needed.

---

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 3, 2017, 4:44pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/3 "2017-06-03T16:44:55Z")

</div>

> **clay.chi wrote:**
> 
> in your `.uniproj` file Include `"js/moment.js:Bundle"` then in your javascript
> 
> ```auto
> var Moment = require("js/moment.js");
> 
> ```
> 
> Now it’s ready to use. You just need to generate the date values with moment library where it’s needed.

Is it possible to do that inline, or do I need to loop thru the data and change the data?

---

<div class="post-metadata">

**Author:** ![Clay](https://avatars.discourse-cdn.com/v4/letter/c/65b543/32.png) [@Clay](https://forums.fusetools.com/u/Clay)\
**Post date:** [June 3, 2017, 4:54pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/4 "2017-06-03T16:54:40Z")

</div>

I believe it’s possible, still learning the UX markup. With `trigger.actions` and `callback functions` inside UX but common way to do, for example when you update/edit/create your `article` model, you can just generate the date in functions and store the data with it.

---

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 3, 2017, 5:01pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/5 "2017-06-03T17:01:00Z")

</div>

> **clay.chi wrote:**
> 
> I believe it’s possible, still learning the UX markup. With `trigger.actions` and `callback functions` inside UX but common way to do, for example when you update/edit/create your `article` model, you can just generate the date in functions and store the data with it.

Currently this app is showing news, no editing or adding yet. So it is just viewing articles.

---

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 3, 2017, 5:02pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/6 "2017-06-03T17:02:35Z")

</div>

I could do it from the API end, but it would be best to do it in the app. Because of locales etc.

---

<div class="post-metadata">

**Author:** ![Clay](https://avatars.discourse-cdn.com/v4/letter/c/65b543/32.png) [@Clay](https://forums.fusetools.com/u/Clay)\
**Post date:** [June 3, 2017, 5:17pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/7 "2017-06-03T17:17:29Z")

</div>

> **Daniel Billing wrote:**
> 
> I could do it from the API end, but it would be best to do it in the app. Because of locales etc.

It sounds wrong. If each `News` needs a value of date property, it must be in served by the backend. After fetching the data by client, you will need to convert it to local time.

Edit: However either you add date property after you fetch data (assuming it’s a JSON) for each `News` item for mocked data purpose or you export a single date string for every `News` object for styling purpose i suppose.

---

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 3, 2017, 5:24pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/8 "2017-06-03T17:24:20Z")

</div>

> **clay.chi wrote:**
> 
> > **Daniel Billing wrote:**
> > 
> > I could do it from the API end, but it would be best to do it in the app. Because of locales etc.
> 
> It sounds wrong. If each `News` needs a value of date property, it must be in served by the backend. After fetching the data by client, you will need to convert it to local time.

Thats what I meant, but I guess i typed it wrong. Here is the data from the API:

```auto
"updated_at":{"date":"2016-02-06 15:14:35.000000","timezone_type":3,"timezone":"Europe\/Oslo"},

```

In the UX it just loops thru all the articles. How would I get the date to be converted after I have gathered it and sending it to the view?

---

<div class="post-metadata">

**Author:** ![Clay](https://avatars.discourse-cdn.com/v4/letter/c/65b543/32.png) [@Clay](https://forums.fusetools.com/u/Clay)\
**Post date:** [June 3, 2017, 5:34pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/9 "2017-06-03T17:34:50Z")

</div>

Well, I guess your first post mislead me somewhere.

You can use a trigger action to activate to view and before you generate the view, you make it wait for `fetch()` to complete and make modifications in JSON then send it to view. I think there are some other ways to do it. Like ([https://www.fusetools.com/docs/fuse/triggers/whiletrue](https://www.fusetools.com/docs/fuse/triggers/whiletrue)) can make a view to wait for a condition with observables.

---

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 3, 2017, 5:38pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/10 "2017-06-03T17:38:51Z")

</div>

> **clay.chi wrote:**
> 
> Well, I guess your first post mislead me somewhere.
> 
> You can use a trigger action to activate to view and before you generate the view, you make it wait for `fetch()` to complete and make modifications in JSON then send it to view.

Ok, I will try it out and post the results.

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [June 5, 2017, 12:09pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/11 "2017-06-05T12:09:34Z")

</div>

Daniel,

if you need further assistance on the subject, please post a complete, minimal reproduction that shows what you’ve tried so far. It’s impossible to help with just the snippets shown so far.

---

<div class="post-metadata">

**Author:** ![dsbilling](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/dsbilling/32/723_2.png) [@dsbilling](https://forums.fusetools.com/u/dsbilling)\
**Post date:** [June 5, 2017, 7:47pm UTC](https://forums.fusetools.com/t/date-formatting-with-moment-from-data/6618/12 "2017-06-05T19:47:01Z")

</div>

> **Uldis wrote:**
> 
> Daniel,
> 
> if you need further assistance on the subject, please post a complete, minimal reproduction that shows what you’ve tried so far. It’s impossible to help with just the snippets shown so far.

I haven’t had the time yet.