角2模板解析错误意料之外的字符EOF
角2模板解析错误意料之外的字符EOF
提问于 2016-03-05 16:05:22
我刚刚打开和重新运行我的角2TS应用程序在视觉工作室。
上一次我这样做的时候，我很肯定，它没有任何错误。
现在，我在浏览器控制台中得到了这个错误，并且应用程序并没有完全加载：
EXCEPTION: Template parse errors:
Unexpected character "EOF" ("
test
</foot[ERROR ->]"): AppComponent@22:6
angular2.js:23083 EXCEPTION: Template parse errors:
Unexpected character "EOF" ("
test
</foot[ERROR ->]"): AppComponent@22:6BrowserDomAdapter.logError @ angular2.js:23083
angular2.js:23083 STACKTRACE:BrowserDomAdapter.logError @ angular2.js:23083
angular2.js:23083 Error: Template parse errors:
Unexpected character "EOF" ("
test
</foot[ERROR ->]"): AppComponent@22:6
at new BaseException (http://localhost:55555/lib/angular2.js:7351:21)
at TemplateNormalizer.normalizeLoadedTemplate (http://localhost:55555/lib/angular2.js:20019:15)
at http://localhost:55555/lib/angular2.js:20008:24
at Zone.run (http://localhost:55555/lib/angular2-polyfills.js:1243:24)
at Zone.run (http://localhost:55555/lib/angular2.js:13438:32)
at zoneBoundFn (http://localhost:55555/lib/angular2-polyfills.js:1220:26)
at lib$es6$promise$$internal$$tryCatch (http://localhost:55555/lib/angular2-polyfills.js:468:17)
at lib$es6$promise$$internal$$invokeCallback (http://localhost:55555/lib/angular2-polyfills.js:480:18)
at lib$es6$promise$$internal$$publish (http://localhost:55555/lib/angular2-polyfills.js:451:12)
at http://localhost:55555/lib/angular2-polyfills.js:123:10
-----async gap-----
Error
at _getStacktraceWithUncaughtError (http://localhost:55555/lib/angular2-polyfills.js:2236:29)
at Zone.fork (http://localhost:55555/lib/angular2-polyfills.js:2285:47)
at Zone.bind (http://localhost:55555/lib/angular2-polyfills.js:1218:53)
at bindArguments (http://localhost:55555/lib/angular2-polyfills.js:1401:36)
at lib$es6$promise$promise$$Promise.obj.(anonymous function) [as then] (http://localhost:55555/lib/angular2-polyfills.js:1413:46)
at TemplateNormalizer.normalizeTemplate (http://localhost:55555/lib/angular2.js:20007:44)
at TemplateCompiler.normalizeDirectiveMetadata (http://localhost:55555/lib/angular2.js:24233:39)
at http://localhost:55555/lib/angular2.js:24306:24
at Array.map (native)
at Array.map (http://localhost:55555/lib/es6-shim.js:1113:14)
-----async gap-----
Error
at _getStacktraceWithUncaughtError (http://localhost:55555/lib/angular2-polyfills.js:2236:29)
at Zone.fork (http://localhost:55555/lib/angular2-polyfills.js:2285:47)
at NgZone._createInnerZone (http://localhost:55555/lib/angular2.js:13426:39)
at new NgZone (http://localhost:55555/lib/angular2.js:13292:32)
at createNgZone (http://localhost:55555/lib/angular2.js:12475:12)
at PlatformRef_.application (http://localhost:55555/lib/angular2.js:12550:31)
at Object.bootstrap (http://localhost:55555/lib/angular2.js:24805:64)
at execute (http://localhost:55555/app/main.js:28:23)
at u (http://localhost:55555/lib/system.js:5:3330)
at Object.execute (http://localhost:55555/lib/system.js:5:6218)BrowserDomAdapter.logError @ angular2.js:23083
:55555/app/main.js:31 BaseExceptionmessage: "Template parse errors:↵Unexpected character "EOF" ("↵ test
↵
↵</foot[ERROR ->]"): AppComponent@22:6"stack: "Error: Template parse errors:↵Unexpected character "EOF" ("↵ test
↵
↵</foot[ERROR ->]"): AppComponent@22:6↵ at new BaseException (http://localhost:55555/lib/angular2.js:7351:21)↵ at TemplateNormalizer.normalizeLoadedTemplate (http://localhost:55555/lib/angular2.js:20019:15)↵ at http://localhost:55555/lib/angular2.js:20008:24↵ at Zone.run (http://localhost:55555/lib/angular2-polyfills.js:1243:24)↵ at Zone.run (http://localhost:55555/lib/angular2.js:13438:32)↵ at zoneBoundFn (http://localhost:55555/lib/angular2-polyfills.js:1220:26)↵ at lib$es6$promise$$internal$$tryCatch (http://localhost:55555/lib/angular2-polyfills.js:468:17)↵ at lib$es6$promise$$internal$$invokeCallback (http://localhost:55555/lib/angular2-polyfills.js:480:18)↵ at lib$es6$promise$$internal$$publish (http://localhost:55555/lib/angular2-polyfills.js:451:12)↵ at http://localhost:55555/lib/angular2-polyfills.js:123:10"__proto__: __(anonymous function) @ :55555/app/main.js:31当我检查AppComponent.ts类时
import {Component} from 'angular2/core';
import {RouteConfig, Router, ROUTER_DIRECTIVES} from 'angular2/router';
import {FORM_PROVIDERS} from 'angular2/common';
import {RouterActive} from './router-active';
import {Schoolyears} from './schoolyears/schoolyear.component';
import {Administration} from './administration/administration.component';
import 'rxjs/add/operator/map';
@Component({
selector: 'my-app',
providers: [...FORM_PROVIDERS],
directives: [...ROUTER_DIRECTIVES, RouterActive],
pipes: [],
styles: [],
templateUrl: './app/app.html'
})
@RouteConfig([
{ path: '/', component: Schoolyears, name: 'Index' },
{ path: '/schoolyears', component: Schoolyears, name: 'Index' },
{ path: '/administration', component: Administration, name: 'Administration' }
//{ path: '/', redirectTo: ['Index'] } // otherwise url when not exist
])
export class AppComponent {
name = 'Angular 2 Webpack Starter';
url = 'https://twitter.com/AngularClass';
constructor() {
}
}或app.html
<header>
<nav>
<h1>Hello {{ name }}</h1>
<ul>
<li router-active>
<a [routerLink]="['Index']">Schoolyears</a>
</li>
<li router-active>
<a [routerLink]="['Administration']">Administration</a>
</li>
</ul>
</nav>
</header>
<main>
<router-outlet></router-outlet>
</main>
<footer>
test
</footer>My main.ts，它是everything的条目
///<reference path="../node_modules/angular2/typings/browser.d.ts"/>
import {provide} from 'angular2/core';
import {bootstrap, ELEMENT_PROBE_PROVIDERS} from 'angular2/platform/browser';
import {ROUTER_PROVIDERS, LocationStrategy, HashLocationStrategy} from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
//import {APP_BASE_HREF} from 'angular2/router';
const ENV_PROVIDERS = [];
ENV_PROVIDERS.push(ELEMENT_PROBE_PROVIDERS);
import {AppComponent} from './app.component'
bootstrap(AppComponent, [
...ENV_PROVIDERS,
...HTTP_PROVIDERS,
...ROUTER_PROVIDERS,
provide(LocationStrategy, { useClass: HashLocationStrategy })
])
.catch(err => console.error(err));我看不出有什么不对劲。
我怎么才能解决呢？
更新
在main.js文件中，我似乎得到了这个错误“如果”，这是真正的错误.
回答 3
Stack Overflow用户
发布于 2016-03-24 10:17:36
我得到了一个意想不到的字符"EOF“错误，很难调试，我做了什么来解决这个问题：
我的组件的模板文件中有一个html注释：<!----- Notifications -----> --我把它改为：<!-- Notifications --> --这不是第一次，每次我有这个错误时，我都会修复html注释，以<!--开头，然后用-->而不是--->来结束，这个问题就解决了。
请参阅：评语
在我的例子中，它是注释，但我认为通常需要有有效的html，否则解析器可能会抛出错误。
Stack Overflow用户
发布于 2016-12-04 01:36:12
我注意到，当Angular2应用程序中的HTML无效时，您就会得到它。因此，尝试通过删除、不寻常的html标记等进行调试。在我的案子里，我错过了结案时间。
Stack Overflow用户
发布于 2016-11-01 05:09:11
这个错误是由于a2和webpack html加载程序之间的一些不兼容造成的。在官方a2 webpack指南中使用的解决方法是
htmlLoader: {
minimize: false // workaround for ng2
},有关这方面的更多信息，可以在第7295期中找到。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35816376
复制相关文章
相似问题
腾讯云开发者
