JSF separation character and prependId='false'

There's an annoying incompatibility between AngularJS and JSF. Since AngularFaces 2.1.3, the problem has been mostly, but not completely solved.

JSF gives the DOM elements ids that don't look like what AngularJS
considers a valid id. JSF ids are composed of the parent id, plus a colon, plus the component's id. If the JSF view is more
complex, there can be an arbitrary number of parent ids preprending the component id.

This is necessary to make ids unique in the entire application's namespace. For instance, data tables consist of several
identical rows. To know one row from another the row index is added to the id, as you can see in this example taken from the PrimeFaces showcase:

"ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
"Next to the colon, the only sensible choices are the hyphen, the underscore and the period. As the period is at its own also a special character in CSS selectors, it would have the same problem as the colon.
So logically you don't have much other choice than the hyphen - and the underscore _."

The underscore, in turn, is used by JSF itself in ids, so chances are you run into problems, too.

Unfortunately, AngularJS doesn't accept any special character other than the underscore in ids and names of HTML fields. Until now, I've noticed two
problems:

AngularJS doesn't populate the form's error object for fields with invalid names. You can't use ngMessages.

You can't set a watch on an input field with an illegal id.

AngularFaces 2.1.0-2.1.2 suffered badly from this incompatibility. At the time, I recommended to add the attribute prependId="false" to the form.
Unfortunately, this doesn't work well, too - for instance, editable input fields and buttons are broken in data tables.

Since AngularFaces 2.1.3, the most offending problems have been solved by rewriting <pui-label /> and <pui-message />.
Now you can use regular JSF ids. But keep in mind that you can run into problems if you set a watch on an JSF input field.

JSF separation character and prependId='false'

There's an annoying incompatibility between AngularJS and JSF. Since AngularFaces 2.1.3, the problem has been mostly, but not completely solved.

JSF gives the DOM elements ids that don't look like what AngularJS
considers a valid id. JSF ids are composed of the parent id, plus a colon, plus the component's id. If the JSF view is more
complex, there can be an arbitrary number of parent ids preprending the component id.

This is necessary to make ids unique in the entire application's namespace. For instance, data tables consist of several
identical rows. To know one row from another the row index is added to the id, as you can see in this example taken from the PrimeFaces showcase:

"ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
"Next to the colon, the only sensible choices are the hyphen, the underscore and the period. As the period is at its own also a special character in CSS selectors, it would have the same problem as the colon.
So logically you don't have much other choice than the hyphen - and the underscore _."

The underscore, in turn, is used by JSF itself in ids, so chances are you run into problems, too.

Unfortunately, AngularJS doesn't accept any special character other than the underscore in ids and names of HTML fields. Until now, I've noticed two
problems:

AngularJS doesn't populate the form's error object for fields with invalid names. You can't use ngMessages.

You can't set a watch on an input field with an illegal id.

AngularFaces 2.1.0-2.1.2 suffered badly from this incompatibility. At the time, I recommended to add the attribute prependId="false" to the form.
Unfortunately, this doesn't work well, too - for instance, editable input fields and buttons are broken in data tables.

Since AngularFaces 2.1.3, the most offending problems have been solved by rewriting <pui-label /> and <pui-message />.
Now you can use regular JSF ids. But keep in mind that you can run into problems if you set a watch on an JSF input field.