Angular2/Typescript对象和属性绑定到模板

注意：我想知道正确的方法或更多的东西 角度1

在

angular1

中，我们可以执行如下操作

$scope.user={};
$scope.user.name="micronyks";
$scope.user.age="27";

或者直接像

$scope.user={name:"micronyks",age:"27"}

绑定到模板看起来像

<div>My name is {{user.name}} & I'm {{user.age}} year(s) old. </div>

应用程序ts

export class LoginModel()
{
  private name:string;
  private age:number;
}

import {LoginModel} from '../models.ts';

user=new LoginModel()
constructor()
{
   this.user.name="micronyks"
   this.user.age="27"
}

app.html

我的名字是{{user.name}&我是{{user.age}岁

我们可以直接创建一个具有属性和值的对象吗

我知道
TypeScript
主要与
type
有关

但我想知道是否还有其他东西，是否有人知道一些深层次的东西

如果你想展示一些东西，你可以使用这个插件：
你也可以使用Angular2中的文字对象，比如Angular1。因为Angular2可以与TypeScript一起使用，所以可以利用它的强类型。通过这种方式，可以指定特性和参数的类型。现在不可能进行检查，如果使用了不正确的类型，则可以获得类型错误

import {LoginModel} from '../models.ts';

export class Test {
  user:LoginModel = new LoginModel()

  constructor() {
    this.user.name = 'micronyks';
    this.user.age = 27;

    this.someMethod(this.user);
  }

  someMethod(user:LoginModel) {
    // ...
  }
}

另一点与依赖项注入有关，因为Angular2可以依赖类型来知道要注入哪个实例。。。否则，您需要使用
@Inject

IDE中也存在影响。因为如果定义类型而不是无类型或
any
，则可以完成

事实上，甚至可以混合使用：

interface INumbersOnly {
  [key: string]: number;
}

var x: INumbersOnly = {
  num: 1, // works fine
  str: 'x' // will give a type error
};

所以我想说你可以自由做你想做的；-）

有关更多详细信息，请参见此问题：



您也可以在Angular2中使用文字对象，如Angular1。因为Angular2可以与TypeScript一起使用，所以可以利用它的强类型。通过这种方式，可以指定特性和参数的类型。现在不可能进行检查，如果使用了不正确的类型，则可以获得类型错误

import {LoginModel} from '../models.ts';

export class Test {
  user:LoginModel = new LoginModel()

  constructor() {
    this.user.name = 'micronyks';
    this.user.age = 27;

    this.someMethod(this.user);
  }

  someMethod(user:LoginModel) {
    // ...
  }
}

另一点与依赖项注入有关，因为Angular2可以依赖类型来知道要注入哪个实例。。。否则，您需要使用
@Inject

IDE中也存在影响。因为如果定义类型而不是无类型或
any
，则可以完成

事实上，甚至可以混合使用：

interface INumbersOnly {
  [key: string]: number;
}

var x: INumbersOnly = {
  num: 1, // works fine
  str: 'x' // will give a type error
};

所以我想说你可以自由做你想做的；-）

有关更多详细信息，请参见此问题：



不确定你想要什么？你想创建一个
LoginModel
实例，比如
newloginmodel（“micronyks”，27）
？不，我知道我们可以使用
LoginModel类的
构造函数。正如在angular1中，我们可以做如图所示的事情，在angular2中有可能（类似的事情）吗？如果可能的话，你可以用不同的方式展示。不确定你想要什么？你想创建一个
LoginModel
实例，比如
newloginmodel（“micronyks”，27）
？不，我知道我们可以使用
LoginModel类的
构造函数。就像在angular1中，我们可以做如图所示的事情，在angular2中是否有可能（类似的事情）？如果可能的话，你可以展示不同的方式。非常好。。。谢谢你的解释。非常好。。。谢谢你的解释。