# Struggling with custom decorator working on bound component

**URL:** <https://discourse.aurelia.io/t/struggling-with-custom-decorator-working-on-bound-component/4856>\
**Category:** Uncategorized\
**Created:** [July 22, 2022, 10:49pm UTC](https://discourse.aurelia.io/t/struggling-with-custom-decorator-working-on-bound-component/4856 "2022-07-22T22:49:44Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![brettdusek](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/brettdusek/32/2301_2.png) [@brettdusek](https://discourse.aurelia.io/u/brettdusek)\
**Post date:** [July 22, 2022, 10:49pm UTC](https://discourse.aurelia.io/t/struggling-with-custom-decorator-working-on-bound-component/4856/1 "2022-07-22T22:49:44Z")

</div>

On another project, we have a decorator that we use to set layout which leverages lifecyclehooks and load. On a new project, it’s simply show.binding components and as a result this isn’t working. I can’t seem to figure out what I need to do as an alternative. Any suggestions?

Here is basically what the other project is doing:

Decorator:

```auto
export function layout(layout: string) {
    return function(vm) {
        vm.prototype.layout = layout;

        return vm;
    }
}

```

Class file:

```auto
import { inject, lifecycleHooks } from "aurelia";

@lifecycleHooks()
@inject()
export class LayoutService {
    load(vm: any, params, next, current) {
        if(vm.layout) {
            document.body.setAttribute("layout", vm.layout);
        } else {
            document.body.removeAttribute("layout");
        }
    }
}

```

Which then can of course be called like:

```auto
@layout("mylayout")
export class MyApp {}

```

Since this new project isn’t leveraging a router, I thought I might be able to simply swap load for bound, but then realized lifecyclehooks is for router. Is there another way to do this?

---

<div class="post-metadata">

**Author:** ![zewa666](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/zewa666/32/19_2.png) [@zewa666](https://discourse.aurelia.io/u/zewa666)\
**Post date:** [July 23, 2022, 5:12am UTC](https://discourse.aurelia.io/t/struggling-with-custom-decorator-working-on-bound-component/4856/2 "2022-07-23T05:12:41Z")

</div>

not sure but you’re setting the layout property but accessing iqLayout

---

<div class="post-metadata">

**Author:** ![brettdusek](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/brettdusek/32/2301_2.png) [@brettdusek](https://discourse.aurelia.io/u/brettdusek)\
**Post date:** [July 25, 2022, 1:27pm UTC](https://discourse.aurelia.io/t/struggling-with-custom-decorator-working-on-bound-component/4856/3 "2022-07-25T13:27:41Z")

</div>

Sorry about that. I simplified the example down but missed a few. That’s not it, though. I can’t use load() and lifecyclehooks because there isn’t a router. Looking for something equivalent to lifecyclehooks for the component to do something like:

```auto
    bound(vm: any, params) {
        if(vm.layout) {
            document.body.setAttribute("layout", vm.layout);
        } else {
            document.body.removeAttribute("layout");
        }
    }

```