Angular2可选隔离范围(从角度1)

Question

我研究了角2。对于示例组件，需要一个用户参数来呈现有关该用户的信息：

<user-profile [user]="currentUser"></user-profile>

我想在多个地方使用这个组件/如何在组件‘用户配置文件’中进行隔离绑定？

更新，例如，我使用组件

@Component({
selector: 'my-hero-detail',

template: `

<div *ngIf="hero">
<h2>{{hero.name}} details!</h2>
<div><label>id: </label>{{hero.id}}</div>
<div>
  <label>name: </label>
  <input [(ngModel)]="hero.name" placeholder="name"/>
</div>
</div>
 `
 })

我在组件中传递数据

<my-hero-detail [hero]="selectedHero"></my-hero-detail>

更改hero.name使更改和selectHero。

如何避免呢?我想selectHero不改变

Answer 1

像这样编写您的子组件

​

import { Component, Input } from '@angular/core';     
    import { User } from './user';
     
    @Component({
      selector: 'user-profile',
      template: `
        <h3>User Name: {{user.name}} says:</h3>
        <p>Telephone: {{user.telephone}}</p>
      `
    })
    export class UserProfile{
      @Input() user: User;
    }

​

然后构造父级并将用户传递给子级。

​

import { Component } from '@angular/core';     
    import { User } from './user';
     
    @Component({
      selector: 'user-list',
      template: `
        <user-profile *ngFor="let currentUser of users" [user]="currentUser"></user-profile>
      `
    })
    export class UserListComponent {
      heroes = User[];
    }

​