The best thing you can do is to connect those parts by one semi-generic identifier. There is no actual difference between using a class, an id, a data-attribute, or a ng-* attribute as hook. If you want to rename it, you have to rename it. If you want to move things around, you have to move them around. There is no way around it.
Your template will also use names of properties, arrays, and objects directly. There also isn't a way around that.
At some point you have to connect your pieces. They can't float around in mid-air forever.
The presentational things you mentioned are different. We can separate those things more, we can use abstractions, and we can make it extremely reusable.
I think you missed my point. Unless you really think there's no difference between naming an html element, and giving it an inline named function handler.
There is no difference. There is one identifier which ties them together. If you change that identifier on one side, but not the other, it will stop working.
It doesn't matter if that identifier is a class or something else.
Well, if it's a class people may feel inclined to reuse that identifier on the CSS side, which is a bad thing, because now you've tied 3 parts together instead of just 2. If I use classes for this, I prefix them with "js-" to indicate that they are only meant for scripting purposes.
with performAcceptanceRoutine(), that cooresponds to an actual global javascript function that must exist, and specifies how (imperative) not what (declarative).
With a class "acceptButton" you are specifying what it is, semantically and declaratively, without reference to some specific procedure that will be carried out, if anything will be done at all. This frees up to a great degree the range of code that you can write to "activate" This html, and also, makes it so that the HTML is not bound to some specific code base, and it can be parsed in situations that explicitly ban javascript.
Your template will also use names of properties, arrays, and objects directly. There also isn't a way around that.
At some point you have to connect your pieces. They can't float around in mid-air forever.
The presentational things you mentioned are different. We can separate those things more, we can use abstractions, and we can make it extremely reusable.