ga-wdi-exercises/project4

template parse error

Closed this issue · 5 comments

I am getting the error below when I try to display components in http://localhost:3000/. I was expecting to display the Home and Nav components. It is a MEAN stack app being developed in Angular 4...
Here is the details in my console:

compiler.es5.js:1690 Uncaught Error: Template parse errors:
Unexpected closing tag "a". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("class="columns small-12 medium-3">
<routerLink="/">[ERROR ->]

"): ng:///AppModule/NavComponent.html@3:65 Unexpected closing tag "a". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("
Event Announcement[ERROR ->]
"): ng:///AppModule/NavComponent.html@6:58 at syntaxError (compiler.es5.js:1690) at DirectiveNormalizer.webpackJsonp.../../../compiler/@angular/compiler.es5.js.DirectiveNormalizer.normalizeLoadedTemplate (compiler.es5.js:14129) at compiler.es5.js:14115 at Object.then (compiler.es5.js:1679) at DirectiveNormalizer.webpackJsonp.../../../compiler/@angular/compiler.es5.js.DirectiveNormalizer.normalizeTemplateOnly (compiler.es5.js:14115) at DirectiveNormalizer.webpackJsonp.../../../compiler/@angular/compiler.es5.js.DirectiveNormalizer.normalizeTemplate (compiler.es5.js:14097) at CompileMetadataResolver.webpackJsonp.../../../compiler/@angular/compiler.es5.js.CompileMetadataResolver.loadDirectiveMetadata (compiler.es5.js:15126) at compiler.es5.js:26803 at Array.forEach () at compiler.es5.js:26802 syntaxError @ compiler.es5.js:1690 webpackJsonp.../../../compiler/@angular/compiler.es5.js.DirectiveNormalizer.normalizeLoadedTemplate @ compiler.es5.js:14129 (anonymous) @ compiler.es5.js:14115 then @ compiler.es5.js:1679 webpackJsonp.../../../compiler/@angular/compiler.es5.js.DirectiveNormalizer.normalizeTemplateOnly @ compiler.es5.js:14115 webpackJsonp.../../../compiler/@angular/compiler.es5.js.DirectiveNormalizer.normalizeTemplate @ compiler.es5.js:14097 webpackJsonp.../../../compiler/@angular/compiler.es5.js.CompileMetadataResolver.loadDirectiveMetadata @ compiler.es5.js:15126 (anonymous) @ compiler.es5.js:26803 (anonymous) @ compiler.es5.js:26802 webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._loadModules @ compiler.es5.js:26799 webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._compileModuleAndComponents @ compiler.es5.js:26769 webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler.compileModuleAsync @ compiler.es5.js:26698 webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_._bootstrapModuleWithZone @ core.es5.js:4535 webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef_.bootstrapModule @ core.es5.js:4521 ../../../../../src/main.ts @ main.ts:11 __webpack_require__ @ bootstrap cfa09b8…:54 0 @ main.ts:11 __webpack_require__ @ bootstrap cfa09b8…:54 webpackJsonpCallback @ bootstrap cfa09b8…:25 (anonymous) @ main.bundle.js:1

Here is my nav.component.html file:

screen shot 2017-07-18 at 11 19 37 am

are <routerLink> components supposed to be closed with closing anchor tags (</a>)? That seems odd, but I have not used Angular 2 or 4. The compiler seems to think so as well:

Unexpected closing tag "a". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("class="columns small-12 medium-3">

<routerLink> should be closed out by </routerLink>.

reopen or post a new issue if necessary!

ok thanks!