如何实例化模型Angular 2

Question

我正在为CRUD产品创建一个非常基本的Angular 2应用程序。我有一个CreateProductComponent，但我在实例化我不想在我的视图上使用的模型时遇到问题。我收到此错误：

这是我的代码：

创建-product.component.ts

import { Component, OnInit }  from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router';

import { Product } from '../product'
import { ProductService } from '../product.service'

@Component({
    moduleId: module.id,
    selector: 'app-create-product',
    templateUrl: 'create-product.html',
    styleUrls: ['create-product.css'],
})
export class CreateProductComponent {

    model: new Product(1,'2',1); <- error on this line

    constructor(private productService: ProductService) { }

    addProduct() {        

        //this.productService.addProduct(this.product);
    }
}

product.ts

export class Product {

    constructor(
        public ID: number,
        public Name: string,
        public Price: number
    ) { }   
}

理想情况下，我想创建一个空产品或具有默认值的产品，以便当视图中的表单填充产品数据时，此数据将传递给产品。有谁知道如何解决这个问题？

Answer 1

应该是

model = new Product(1,'2',1);

Answer 2

问题在于你的语法有点偏差。您应该使用以下任何一种：

这将创建一个实例化值为Product的属性。

export class CreateProductComponent {

    // Define model, declare type, and assign/instantiate.
    model = new Product(1,'2',1);

    constructor(private productService: ProductService) { }
}

或者这个，它将属性model定义为Product的类型，但不为其分配值。而是在构造函数中分配它。

export class CreateProductComponent {

    // Define model, declare type
    model: Product;

    constructor(private productService: ProductService) {
        this.model = new Product(1,'2',1);
    }
}

或者你甚至可以更明确，即使它不是必需的，因为可以很容易地推断出类型。

export class CreateProductComponent {

    // Define model, declare type, and assign/instantiate.
    model: Product = new Product(1,'2',1);

    constructor(private productService: ProductService) { }
}

我强烈建议使用一些很棒的文档here以及REPL playground。

Answer 3

您正在CreateProductComponent中创建一个字段。使用＆＃39; =＆＃39;而不是＆＃39;：＆＃39;像

model = new Product(1,'2',1); <- error on this line

Answer 4

在打字稿术语中'：'表示您为已定义的变量声明了一种类型。

'='表示您要为变量指定值。

但是你在这里做的不是分配你试图声明一个值的值（根据语法不正确）

所以要么你可以直接指定一个像

这样的值

model = new Product(1,'2',1);

或者您可以先声明变量的类型，然后以这两种方式中的任何一种分配值（我个人更喜欢这种方式）

model: Product = new Product(1,'2',1);

或

model: Product;
model = new Product(1,'2',1);