Question

我一直在关注NativeScript的本教程，但它给了我一些错误。

这是我的app.component.ts文件：

import { Component } from '@angular/core';

@Component ({
   selector: 'my-app',
   template: '
   <ul>
      <li><a [routerLink] = "['/Product']">Product</a></li>
      <li><a [routerLink] = "['/Inventory']">Inventory</a></li>
   </ul>
   <router-outlet></router-outlet>'
})
export class AppComponent  { }

我正在使用带有TypeScript插件的Atom，当我将鼠标悬停在template:上时，它告诉我它类型(property) template: boolean似乎很奇怪。如果我尝试将HTML放在一行上，它会告诉我它是类型字符串，几乎就像它不喜欢模板在多行上的事实。

无论如何，我对NS很新，我只是想通过这个教程进步，所以它可能是显而易见的。我已经检查了它告诉我要密切复制的代码，但看不出有什么问题。以下是我在尝试运行应用时看到的错误：

$ npm start

> angular-quickstart@1.0.0 prestart /Users/mb102/Angular-Projects/Demo
> npm run build


> angular-quickstart@1.0.0 build /Users/mb102/Angular-Projects/Demo
> tsc -p src/

src/app/app.component.ts(5,15): error TS1002: Unterminated string literal.
src/app/app.component.ts(7,27): error TS1005: '>' expected.
src/app/app.component.ts(7,43): error TS1005: ':' expected.
src/app/app.component.ts(8,27): error TS1005: '>' expected.
src/app/app.component.ts(8,45): error TS1005: ':' expected.
src/app/app.component.ts(9,5): error TS1110: Type expected.
src/app/app.component.ts(9,6): error TS1161: Unterminated regular expression literal.
src/app/app.component.ts(10,20): error TS1110: Type expected.
src/app/app.component.ts(10,21): error TS1161: Unterminated regular expression literal.

npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build"
npm ERR! node v6.11.0
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! angular-quickstart@1.0.0 build: `tsc -p src/`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the angular-quickstart@1.0.0 build script 'tsc -p src/'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the angular-quickstart package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     tsc -p src/
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs angular-quickstart
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls angular-quickstart
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/mb102/Angular-Projects/Demo/npm-debug.log

npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v6.11.0
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! angular-quickstart@1.0.0 prestart: `npm run build`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the angular-quickstart@1.0.0 prestart script 'npm run build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the angular-quickstart package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     npm run build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs angular-quickstart
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls angular-quickstart
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/mb102/Angular-Projects/Demo/npm-debug.log

Answer 1

您分配给template属性的值是多行字符串。在Typescript中不允许。拥有超过140个字符的字符串通常不是一个好主意（您可以使用精彩的tslint来帮助您），因此将模板放在html文件中会更好

但是，如果您仍然希望将其保留在文件中，则必须使用`（在Windows上使用反引号 - alt + 0096）字符来分隔字符串而不是＆＃39; （单引号）。

Answer 2

使用`（反引号）而不是'（单引号或双引号）声明模板字符串：

template: `
   <ul>
      <li><a [routerLink] = "['/Product']">Product</a></li>
      <li><a [routerLink] = "['/Inventory']">Inventory</a></li>
   </ul>
   <router-outlet></router-outlet>`

NativeScript TypeScript app.component.ts中的“未终止的字符串文字错误”

2 个答案: