2017-07-18 14 views
3

私はプロパティを編集し、ボランティアをそのままにしておきたいので、アングルで(ボランティアからxへ)プロパティをコピーしようとしています。ここでは、TSからのコードは次のとおりです。角度プロパティを別の角度プロパティにコピーする方法は?

ここ
volunteership; 
x ; 

constructor(private viewvolunteershipService: Volunteership, 
    private router: Router) {} 

ngOnInit() { 
    this.viewvolunteershipService.getVolunteership().subscribe(volunteership => 
     this.volunteership = volunteership); 
    console.log("Volunteership", this.volunteership); 
      this.x = this.volunteership; 
} 

、HTMLに私は、私はそれから都市を選択することができますが、それは私には何も表示されませんngForのプロパティxを呼び出したいです。 xの代わりにボランティアを使うと、それは完璧に働いています。ボランティア活動をxにコピーすると、そこから都市を選ぶことができますか?

<div class="form-group" > 
    <label for="city" >City</label> 
     <select id="city" class="form-group" > 
      <option value=""></option> 
      <option *ngFor=" let z of x" >{{z.city}}</option> 

     </select> 
    </div> 

私はすでに、私もObject.assign()メソッドと、まだ何を使って試してみた配列

for (var i = 0, len = this.volunteership.length; i < len; i++) { 
    this.x[i] = this.volunteerhip[i]; 
} 

としてコピーしようとしました。

+0

'subscribe'は非同期です。つまり、あなたがサービスを呼び出す間、' subscribe'の外のコードは実行を停止しません。あなたがあなたの 'volunteership'に設定したデータを使いたいなら、あなたは購読の中で、あるいはあなたのサービスがすでにデータを取得していることを保証する方法でそれを行う必要があります(例えば' change'イベントを'* ngIf =" volunteership "'を使用して表示されます) – snaplemouton

答えて

1

まず、How do I return the response from an Observable/http/async call in angular2?のようにコールバック(subscribe)で代入を行う必要がありますが、変更内容はx配列に反映されることだけを言います。あるとしてxvolunteershipへの参照を持っているように、すべての変更は、両方の配列に起こるのだろう、あなたはおそらくObject.assignを使用したいと思い何を:

ngOnInit() { 
    this.viewvolunteershipService.getVolunteership().subscribe(volunteership => { 
    this.volunteership = volunteership; 
    this.x = this.volunteership.map(obj => Object.assign({}, obj)) 
    }); 
} 

は今 x配列は volunteership配列への参照を持っていません。

+0

ありがとう、実際に働いた!私がxにしたい変更は、まだサブスクライブする必要がありますか? –

+0

はい、データを取得した後に変更が必要な場合は、 'subscribe'の中でそれを行う必要があります:) – Alex

+0

ボランティアの選択肢を別のオブジェクトに保存するにはどうすればいいですか? –

関連する問題