Angular 11中PUG编写href="#"时编译报Assigning to rvalue错误的原因

Assigning to rvalue语法错误的本质是PUG模板引擎的属性解析规则与特殊字符的上下文识别冲突，和Angular 11的模板编译逻辑、相邻的md-tooltip/glyphicon组件结构无直接关联。
具体解析链路如下：

• PUG处理标签后括号包裹的行内属性块时，会优先把块内key=value结构作为JavaScript表达式求值解析，不会默认将块内内容按纯静态HTML属性做无差别识别。
• 解析到出错行的href="#"结构时，#是PUG语法体系的保留特殊字符（用于标识id选择器、文档锚点的节点定位），在属性表达式上下文里，解析器会错把=后面的#判定为未被字符串完全包裹的独立字面量，进而认为代码正在对一个不可作为赋值目标的右值（字面量本身）执行赋值操作，最终抛出该语法错误。
• 报错日志标注的第20行第38列位置，刚好对应href="#"中等号与#字符的相邻坐标点，和解析器的触发逻辑完全匹配。

• 这类报错只会在PUG括号包裹的行内属性块中出现，常规写在标签选择器后缀的静态属性（比如a.navbar-toggle.collapsed#）不会触发同类问题。
• 当属性块内连续排列多个无分隔的复杂属性时，比如相邻写href="#"和带括号的(click)事件绑定，会进一步放大解析器对引号边界的识别错位概率。
• 用双引号包裹属性值时，#的特殊字符优先级会被解析器优先识别，盖过字符串字面量的边界判定。

• 调整属性值的引号包裹方式，用单引号包裹含#的静态属性值，明确字符串边界，消除解析器的识别歧义。
• 替换纯#的空跳转写法，比如用href="javascript:void(0)"或href=""配合(click)="$event.preventDefault()"阻止默认跳转，从根源避开#字符的特殊解析规则。
• 将href这类静态属性从括号属性块中移出，直接跟在标签选择器后面写为PUG静态属性，绕开表达式解析的逻辑分支。

该错误发生在PUG模板转译阶段，早于Angular的模板编译流程，无需排查Angular侧的路由、组件绑定配置。

内容的提问来源于stack exchange，提问作者Jason