5 Replies Latest reply on Feb 7, 2020 1:55 PM by 1812359

How to reference appController in a view, $root doesn't seem to work any longer?

1812359 Feb 6, 2020 5:49 PM

Hi All,

All of my viewModels have the appController added so i can reference things by calling app.functionName() or app.variable just fine.

My issue is trying to reach up to this while in a view. For example, I have a listView where I want to format a particular field, so I created a function in the appController.

I am trying something like:

<oj-bind-text

value="[[$root.formattedTime($current.data.timeVariable)]]">

</oj-bind-text>

That doesnt work as it doesnt like $root. If I add the formattedTime function to the viewModel the view uses then it works:

<oj-bind-text

value="[[formattedTime($current.data.timeVariable)]]">

</oj-bind-text>

I want to avoid copying this function to all the viewModels that need it. I gather I am missing something simple here, but it has plagued me for a while!

Thanks for any help.

1. Re: How to reference appController in a view, $root doesn't seem to work any longer?

Duncan Mills-Oracle Feb 6, 2020 6:00 PM (in response to 1812359)

The way to approach this is just to create a separate class for your utility functions and then just include that in the define block of any modules that need access to those utilities

e.g. simplistically a utils.js under /src/js
define([], function () {
   'use strict';
   function Utils() {};

Utils.prototype.formattedTime = function (time) {
   ...
}
   return new Utils;
});

Then from any module that needs it

define(['utils],
function(Utils) {
...
}

Now Utils.formattedTime() will be available in the context of that page / module
Like Show 0 Likes(0)

Actions
2. Re: How to reference appController in a view, $root doesn't seem to work any longer?

1812359 Feb 6, 2020 6:04 PM (in response to Duncan Mills-Oracle)

Thanks for the reply. That is essentially what I am doing with appController, but I understand why it's best to separate.

How would i reach into it from my view though? In this example it doesn't work even though the viewModel has access to app.formattedTime:
<oj-bind-text
value="[[app.formattedTime($current.data.timeVariable)]]">
</oj-bind-text>

Would it be any different if I did?
<oj-bind-text
value="[[Utils.formattedTime($current.data.timeVariable)]]">
</oj-bind-text>

I feel like I am just getting the syntax wrong.
Like Show 0 Likes(0)

Actions
3. Re: How to reference appController in a view, $root doesn't seem to work any longer?

1812359 Feb 7, 2020 3:53 AM (in response to 1812359)

Just to follow up on this,

I created a Utils like you suggested, but when I try referencing Utils in the view it says Utils is not defined. Is it possible to reference it directly in the view? Basically i have some data that I want to format (remove spaces, format time, etc).

I am trying the below but getting that Utils is not defined even though ive added it to the define and function sections of viewModel.
<oj-bind-text
value="[[Utils.formattedTime($current.data.timeVariable)]]">
</oj-bind-text>
Like Show 0 Likes(0)

Actions
4. Re: How to reference appController in a view, $root doesn't seem to work any longer?

Duncan Mills-Oracle Feb 7, 2020 10:04 AM (in response to 1812359)

To access it in the view then just store a reference on the module this.

e.g.
define(['utils], function(Utils) {
function MyViewModel(params) {
this.Utils = Utils;

The viewModel is the context that the page can see and so references to Utils will resolve.
Like Show 0 Likes(0)

Actions
5. Re: How to reference appController in a view, $root doesn't seem to work any longer?

1812359 Feb 7, 2020 1:55 PM (in response to Duncan Mills-Oracle)

Thank you so much, I feel a bit silly for not realizing that but am learning the pillars of javaScript in step with JET. I really appreciate it.
Like Show 0 Likes(0)

Actions

Go to original post