# Strange behavior of t.bind in Aurelia 2

**URL:** <https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443>\
**Category:** Help Requests\
**Created:** [May 21, 2025, 10:16am UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443 "2025-05-21T10:16:10Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![graycrow](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/graycrow/32/323_2.png) [@graycrow](https://discourse.aurelia.io/u/graycrow)\
**Post date:** [May 21, 2025, 10:16am UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/1 "2025-05-21T10:16:10Z")

</div>

While migrating my apps to Aurelia 2, I noticed strange behavior with the binding for the translation attribute, `t`. Here is simplified example:

```html
<div if.bind="obj">
    <span t.bind="obj.property"></span>
</div>

```

If the object (`obj`) disappears, i.e., if it is set to null, the binding (`t.bind` ) throws the error: “AUR0203: Trying to retrieve a property or build a scope from a null/undefined scope”. I thought that `if.bind` on the parent element would take care of that, meaning div would be removed from the DOM and binding would not happen if there is no `obj`, as was the case in Aurelia 1.

It works if I use the same expression in the getter in the view-model, and bind the `t` attribute to that getter. However, this approach is much less flexible. I don’t understand what’s going on or how to make it work as before. I would appreciate any help. Thanks!

[Edit] Another real world example. This code throws the AUR0203:

```html
<span t.bind="invitation.relationTypeId | userType"></span>

```

And this works:

```html
<span>${invitation.relationTypeId | userType | t}</span>

```

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [May 22, 2025, 6:45am UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/2 "2025-05-22T06:45:26Z")

</div>

This is likely because t binding (translation binding) doesnt stop after its owner (view created by if has been deactivated. Can you help with a gh issue and possibly a small repro (preferrably stackblitz) @graycrow ?

---

<div class="post-metadata">

**Author:** ![graycrow](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/graycrow/32/323_2.png) [@graycrow](https://discourse.aurelia.io/u/graycrow)\
**Post date:** [May 22, 2025, 2:12pm UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/3 "2025-05-22T14:12:09Z")

</div>

As always, everything works when I created a minimal case at stackblitz, but not in my actual project, which has many nested components and asynchronous requests. I will try to isolate the issue and either fix my code or file a bug.

This is the [stackblits exampe](https://stackblitz.com/edit/au2-conventions-1gchpenx), just for reference, it works as intended.

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [May 25, 2025, 10:09pm UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/4 "2025-05-25T22:09:23Z")

</div>

@graycrow if you are still seeing it can you grab the trace when it happens?

---

<div class="post-metadata">

**Author:** ![graycrow](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/graycrow/32/323_2.png) [@graycrow](https://discourse.aurelia.io/u/graycrow)\
**Post date:** [June 3, 2025, 6:45pm UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/5 "2025-06-03T18:45:28Z")

</div>

@bigopon sorry, it took me a while but I think I found a bug in `aurelia/i18n`. Long story short, the `handleChange()` method of the `TranslationBinding` class is missing the check for when it is unbound:

```Typescript
        if (!this.isBound) {
            return;
        }

```

Look at this sample code:

```HTML
<span if.bind="obj.condition">
    <span t.bind="obj.value"></span>
</span>

```

If the value of `obj.condition` in this code becomes falsy, the `SubscriberRecord` instance from the `aurelia/runtime` notifies all subscribers. In my case, there are two subscribers: an instance of `PropertyBinding` for `if.bind` and an instance of `TranslationBinding` for `t.bind`. During the `PropertyBinding.handleChange()` run, the `TranslationBinding` instance becomes unbound, and its `_scope` becomes undefined, but then its `handleChange()` function still tries to handle that change via a few `astEvaluate()` calls finally leading to the “AUR0203” error because of missing scope.

A comment in the SubscriberRecord class states that isBound should probably be checked. However, this is missing from the TranslationBinding.handleChange() method, but it exists, for example, in the similar `PropertyBinding.handleChange()`:

```Typescript
            /**
             * Note: change handlers may have the side-effect of adding/removing subscribers to this collection during this
             * callSubscribers invocation, so we're caching them all before invoking any.
             * Subscribers added during this invocation are not invoked (and they shouldn't be).
             * Subscribers removed during this invocation will still be invoked (and they also shouldn't be,
             * however this is accounted for via $isBound and similar flags on the subscriber objects)
             */

```

In my case, modifying the “aurelia/i18n” im my project’s node\_modules by inserting this condition

```Typescript
        if (!this.isBound) {
            return;
        }

```

in the top of `TranslationBinding.handleChange()`method in `/node_modules/@aurelia/i18n/dist/esm/index.mjs` fixes all translation binding issues for me. However, no matter what I do, I can’t reproduce this bug in the simplest stackblits project, so I’m resisting submitting a proper bug report to GitHub.

---

<div class="post-metadata">

**Author:** ![Sayan751](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/sayan751/32/1861_2.png) [@Sayan751](https://discourse.aurelia.io/u/Sayan751)\
**Post date:** [June 5, 2025, 5:50pm UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/6 "2025-06-05T17:50:06Z")

</div>

Hi @graycrow, I think [this bug](https://github.com/aurelia/aurelia/issues/2101) is fixed already and should be out with the beta.24 release. If you are still facing the issue with the beta.24 version, let us know. In that case, you may also open a new issue and/or submit a PR.

---

<div class="post-metadata">

**Author:** ![graycrow](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/graycrow/32/323_2.png) [@graycrow](https://discourse.aurelia.io/u/graycrow)\
**Post date:** [June 6, 2025, 5:32pm UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/7 "2025-06-06T17:32:05Z")

</div>

@Sayan751 Unfortunately it’s happening in beta-24, I would create a new issue.

---

<div class="post-metadata">

**Author:** ![graycrow](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/graycrow/32/323_2.png) [@graycrow](https://discourse.aurelia.io/u/graycrow)\
**Post date:** [June 9, 2025, 4:29pm UTC](https://discourse.aurelia.io/t/strange-behavior-of-t-bind-in-aurelia-2/6443/8 "2025-06-09T16:29:00Z")

</div>

I created a simple example. Previously, I used the Vite example, but my project uses Webpack. Surprisingly, it functions properly in Vite, but it throws an exception only when it is bundled by Webpack.  
Here is example to reproduce the bug: [stackblitz (Webpack)](https://stackblitz.com/edit/au2-conventions-wmqh5zin?file=src%2Fmy-app.html,src%2Fmy-app.ts). The same code in Vite works: [stackblitz (Vite)](https://stackblitz.com/edit/au2-conventions-k1xrgtna?file=src%2Fmy-app.ts,src%2Fmy-app.html)