Component inheritance with bindings on the base doesn't work as expected

**I'm submitting a bug report**

* **Library Version:**
```
"aurelia-animator-css": "1.0.4",
"aurelia-binding": "2.5.4",
"aurelia-bootstrapper": "2.3.3",
"aurelia-event-aggregator": "1.0.3",
"aurelia-fetch-client": "1.8.2",
"aurelia-framework": "1.3.1",
"aurelia-history": "1.2.1",
"aurelia-history-browser": "1.4.0",
"aurelia-loader-nodejs": "1.1.0",
"aurelia-loader-webpack": "2.2.1",
"aurelia-logging": "^1.5.2",
"aurelia-logging-console": "1.1.1",
"aurelia-pal": "1.8.2",
"aurelia-pal-browser": "1.8.1",
"aurelia-pal-nodejs": "2.0.0",
"aurelia-polyfills": "1.3.4",
"aurelia-router": "1.7.1",
"aurelia-templating": "1.10.4",
"aurelia-templating-resources": "1.13.1",
"aurelia-templating-router": "1.4.0",
```

**Please tell us about your environment:**
* **Operating System:**
Windows 10

* **Node Version:**
12.7.0

* **NPM Version:**
6.14.8

* **Aurelia CLI OR JSPM OR Webpack AND Version**
I'm using Webpack
```
"aurelia-cli": "^1.0.2",
"aurelia-tools": "^2.0.0",
"aurelia-webpack-plugin": "^3.0.0",
"webpack": "^4.27.0",
```

* **Browser:**
Chrome (maybe All)

* **Language:**
TypeScript 3.6.4

**Current behavior:**
I'm talking about normal components, none of this cool shadow component stuff

Base Component has a property binding
Component A extends the base and displays it in funky red text
Component B extends the base and displays it in boring black text
Coincidentally, both components have a dependency that is autoinjected (to get to the base which needs it)

If I have a page that renders Component A, then I navigate to a page that renders Component B, either Component B won't render at all, or it will render as though I was using Component A. Likewise if I first went to a page that had Component B on it, then went to a page with Component A, then Component A wouldn't display (or would be displaying like Component B). I think there is some kind of caching going on somewhere in the composition engine based on the component's "fingerprint", and that caching mechanism seems to think these components are the same.

The solution is to take the binding decorator off the Base Component. I declare the property as abstract on the abstract base (keep TypeScript happy). I declare the property with the binding decorator and Component A and Component B separately.

**Expected/desired behavior:**
That both components would display as expected and that I wouldn't need to declare the property with the binding decorator separately on Component A and Component B, rather than just declaring it in the Base Component.

I think this is enough and the workaround is not a problem for me but if you need more information then let me know.

By the way, Aurelia rocks 😁

Reproduce the reported navigation sequence between pages rendering Component A and Component B, using the stated base-component binding and injected dependency setup. Inspect the composition engine's component fingerprint or caching behavior; done means both derived components render their own styles and inherited binding without duplicating the binding decorator.

Written by the indexing model from the issue text.