2017-04-24 63 views
1

我有一個角度CLI應用程序,我正在設置,我需要從使用Chrome測試運行器切換到PhantomJS測試運行器。我以爲我已經完成了所有必要的更新,但現在我得到了一個奇怪的模板錯誤。使用PhantomJS的角度CLI故障

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 ("  Don't have an account?<br/> 
      <a [routerLink]='['/register']'>Click here to create one[ERROR ->]</a> 
     </p> 
     </div> "): ng:///AuthModule/[email protected]:66 
    at syntaxError (http://localhost:4200/vendor.bundle.js:70405:34) [<root>] 
    at DirectiveNormalizer.normalizeLoadedTemplate (http://localhost:4200/vendor.bundle.js:81741:19) [<root>] 
    at DirectiveNormalizer.normalizeTemplateSync (http://localhost:4200/vendor.bundle.js:81717:21) [<root>] 
    at DirectiveNormalizer.normalizeTemplate (http://localhost:4200/vendor.bundle.js:81691:43) [<root>] 
    at CompileMetadataResolver._loadDirectiveMetadata (http://localhost:4200/vendor.bundle.js:82626:75) [<root>] 
    at http://localhost:4200/vendor.bundle.js:82819:54 [<root>] 
    at Array.forEach (native) [<root>] 
    at CompileMetadataResolver.loadNgModuleDirectiveAndPipeMetadata (http://localhost:4200/vendor.bundle.js:82818:41) [<root>] 
    at http://localhost:4200/vendor.bundle.js:94042:58 [<root>] 
    at Array.forEach (native) [<root>] 
    at JitCompiler._loadModules (http://localhost:4200/vendor.bundle.js:94041:43) [<root>] 
    at JitCompiler._compileModuleAndComponents (http://localhost:4200/vendor.bundle.js:93995:52) [<root>] 
    at JitCompiler.compileModuleAsync (http://localhost:4200/vendor.bundle.js:93957:21) [<root>] 
    at PlatformRef_._bootstrapModuleWithZone (http://localhost:4200/vendor.bundle.js:4997:25) [<root>] ZoneAwareError @ zone.js:917 syntaxError @ compiler.es5.js:1503 DirectiveNormalizer.normalizeLoadedTemplate @ compiler.es5.js:12839 DirectiveNormalizer.normalizeTemplateSync @ compiler.es5.js:12815 DirectiveNormalizer.normalizeTemplate @ compiler.es5.js:12789 CompileMetadataResolver._loadDirectiveMetadata @ compiler.es5.js:13724 (anonymous) @ compiler.es5.js:13917 CompileMetadataResolver.loadNgModuleDirectiveAndPipeMetadata @ compiler.es5.js:13916 (anonymous) @ compiler.es5.js:25140 JitCompiler._loadModules @ compiler.es5.js:25139 JitCompiler._compileModuleAndComponents @ compiler.es5.js:25093 JitCompiler.compileModuleAsync @ compiler.es5.js:25055 PlatformRef_._bootstrapModuleWithZone @ core.es5.js:4786 PlatformRef_.bootstrapModule @ core.es5.js:4772 214 @ main.ts:11 
__webpack_require__ @ bootstrap 7411843…:52 505 @ main.bundle.js:609 
__webpack_require__ @ bootstrap 7411843…:52 webpackJsonpCallback @ bootstrap 7411843…:23 (anonymous) @ main.bundle.js:1 

我跑了必要的安裝

npm install --save-dev phantomjs-prebuilt 
npm install --save-dev karma-phantomjs-launcher 
npm install --save-dev karma-spec-reporter 
npm install --save intl 

Karma.config.js

module.exports = function (config) { 
    config.set({ 
    basePath: '', 
    frameworks: ['jasmine', '@angular/cli'], 
    plugins: [ 
     require('karma-jasmine'), 
     require('karma-phantomjs-launcher'), 
     require('karma-spec-reporter'), 
     require('karma-jasmine-html-reporter'), 
     require('karma-coverage-istanbul-reporter'), 
     require('@angular/cli/plugins/karma') 
    ], 
    client:{ 
     clearContext: false // leave Jasmine Spec Runner output visible in browser 
    }, 
    files: [ 
     { pattern: './src/test.ts', watched: false } 
    ], 
    preprocessors: { 
     './src/test.ts': ['@angular/cli'] 
    }, 
    mime: { 
     'text/x-typescript': ['ts','tsx'] 
    }, 
    coverageIstanbulReporter: { 
     reports: [ 'html', 'lcovonly' ], 
     fixWebpackSourcePaths: true 
    }, 
    angularCli: { 
     environment: 'dev' 
    }, 
    reporters: config.angularCli && config.angularCli.codeCoverage 
       ? ['spec', 'coverage-istanbul'] 
       : ['spec', 'kjhtml'], 
    port: 9876, 
    colors: true, 
    logLevel: config.LOG_INFO, 
    autoWatch: true, 
    browsers: ['PhantomJS'], 
    singleRun: false 
    }); 
}; 

和polyfills.ts我未提交以下行

import 'core-js/es6/object'; 
import 'core-js/es6/array'; 
import 'intl'; // Run `npm install --save intl`. 
+0

''Click here to create one你嘗試過使用雙引號'Click here to create one' – gonzofish

+0

是的,就是這樣。謝謝!完全與幻影JS更新無關。 – efarley

回答

0

更改單引號:

<a [routerLink]='['/register']'>Click here to create one</a> 

要雙引號:(我回答這個問題之前我只是知名度的人誰發現這個問題的意見一致)

<a [routerLink]="['/register']">Click here to create one</a>