Question

我在使用angular

编写代码时遇到错误

Uncaught Error: Template parse errors:
Parser Error: Unexpected token '.' at column 17 in [name: {{uppercase | hero.name }}] in ng:///AppModule/HeroesComponent.html@4:5 ("
<div>
  <span>id: </span> {{hero.id}}</div>
<div>[ERROR ->]name: {{uppercase | hero.name }}</div>"): ng:///AppModule/HeroesComponent.html@4:5
The pipe 'hero' could not be found ("
<div>
  <span>id: </span> {{hero.id}}</div>
<div>name: {{[ERROR ->]uppercase | hero.name }}</div>"): ng:///AppModule/HeroesComponent.html@4:13
    at syntaxError (compiler.js:486)
    at TemplateParser.parse (compiler.js:24674)
    at JitCompiler._parseTemplate (compiler.js:34629)
    at JitCompiler._compileTemplate (compiler.js:34604)
    at eval (compiler.js:34505)
    at Set.forEach (<anonymous>)
    at JitCompiler._compileComponents (compiler.js:34505)
    at eval (compiler.js:34375)
    at Object.then (compiler.js:475)
    at JitCompiler._compileModuleAndComponents (compiler.js:34374)

我理解这个错误但是第17列和herosComponent:@4:5是什么我的HTML看起来像

<h2>{{hero.name}} Details </h2>

<div>
  <span>id: </span> {{hero.id}}</div>
<div>name: {{uppercase | hero.name }}</div>

你能解释一下17和4：5究竟是什么

Answer 1

意外的令牌＆＃39;。＆＃39;在第17栏的[name：{{uppercase |英雄名字在ng：///AppModule/HeroesComponent.html@4：5
中

表示您需要打开HeroesComponent的模板。它看起来像：

<h2>{{hero.name}} Details </h2>

<div>
  <span>id: </span> {{hero.id}}</div>
<div>name: {{uppercase | hero.name }}</div>

然后找到 @ 4：5 ，即第4行和第5列。

在角度编译器中，列和行号从0开始。所以：

0. <h2>{{hero.name}} Details </h2>
1.
2.<div>
3.  <span>id: </span> {{hero.id}}</div>
4. <div>name: {{uppercase | hero.name }}</div>
        ^
   012345

现在让我们来看看 17 的含义。

Angular会解析插值，但不会准确显示它的起始位置，而是显示TextNode开始的位置：

name: {{uppercase | hero.name }}

在你的情况下。

另一方面，解析器显示插值中的错误，从插值开始的位置开始：

name: {{uppercase | hero.name }}
        ^
     from here

name: {{uppercase | hero.name }}
                         ^
        01234567.........17

另见

如何阅读和理解角度模板解析器错误

1 个答案: