Question

在遵循教程here的同时，我在编译我的打字稿代码时遇到了语法错误。

这是错误：

/app/pages/list/list.js模块构建失败：SyntaxError：   /focus/projects/ionic-todo/app/pages/list/list.js：意外的令牌   （10:17）8 | 9 |导出类ListPage {


10 |构造函数（nav：NavController）{          | ^ 11 | this.nav = nav; 12 | 13 | this.items = [

正如你所看到的，似乎认为结肠有问题。但是，如果删除冒号，则会在空格中出现类似的错误。

以下是完整代码：

＆＃13;

import {Page, NavController} from 'ionic-angular';
import {AddItemPage} from '../add-item/add-item';


@Page({
  templateUrl: 'build/pages/list/list.html'
})

export class ListPage {
  constructor(nav: NavController){
    this.nav = nav;

    this.items = [
      {'title': 'hi', 'description': 'hello'},
      {'title': 'sadf', 'description': 'asdfasdf'},
      {'title': 'asd', 'description': 'asdf'}
    ];
  }

  addItem()
  {
    this.nav.push(AddItemPage, {ListPage: this});
  }
}

＆＃13;

任何想法可能导致这种情况发生？

Answer 1

您的错误让我认为您尝试直接执行TypeScript代码而无需编译（预处理）或动态编译它。

我认为您的代码应该只是ES6。实际上，使用ES6，您可以获得类支持，但不支持类型支持（例如，在构造函数/方法中）。

我看了一下Ionic2生成器模板，它们似乎是ES6。看到这个链接：

https://github.com/driftyco/ionic2-starter-tabs/tree/master/www

您可以像这样调整代码：

import {Page, NavController} from 'ionic-angular';
import {AddItemPage} from '../add-item/add-item';


@Page({
  templateUrl: 'build/pages/list/list.html'
})

export class ListPage {
  static get parameters() {
    return [[NavController]];
  }

  constructor(nav){
    this.nav = nav;

    this.items = [
      {'title': 'hi', 'description': 'hello'},
      {'title': 'sadf', 'description': 'asdfasdf'},
      {'title': 'asd', 'description': 'asdf'}
    ];
  }

  addItem()
  {
    this.nav.push(AddItemPage, {ListPage: this});
  }
}

Answer 2

当您使用.js文件编写时，您必须提供静态块，即

static get parameters() {
    return [[NavController]];
  }

获取nav的类型，它位于contructor参数中。

但是在.ts文件中，你不需要定义静态块，你只需在构造函数中定义它就像：

constructor (nav : NavController) {}

您可以将其视为nav是变量而NavController是类型。

这就是你收到错误的原因。您在javascript（.js）文件中使用了typescript（.ts）语法。

因此，下次您在观看教程时，请尝试查看教师是否正在使用.js文件或.ts文件： - ）

希望它有所帮助。

编译TypeScript时出现Ionic 2语法错误

2 个答案: