J'utilise angular2 alpha 37.
J'ai défini un Lorsque vous définissez le
code>).
Le composant
@View({
template: '<marker *ng-for="#m of markers" [model]="m"></marker>',
directives:[Marker,NgFor]
})
3 Réponses :
Essayez ceci
Merci pour votre contribution, mais cela donne les mêmes résultats. Sur chaque changement de #m code>, un nouveau marqueur est créé, au lieu de mises à jour.
diviser la liste Ceci est le code dard mais ne devrait pas être difficile à traduire en TS P> ngfor code> iTère sur les données de modèle.
// Marker model
class Marker {
String name;
int position;
Marker(this.name, this.position);
@override
String toString() => 'Marker: $name - $position';
}
Cela fonctionne en effet comme prévu. C'est une honte cependant que cette utilisation explicite d'indices est requise pour ce cas d'utilisation. Je vérifierai également l'autre réponse avant d'accorder une récompense finale
En outre, je m'attendrais à ce que ce qui suit fonctionne également, mais ce n'est pas le cas:
Et comment cette échelle est-elle lorsque le tableau CODE> Marqueurs CODE> change de manière dynamique la longueur? Le MarkersIndexes correspondant CODE> devrait être recalculé à tout moment?
Vous pouvez simplement ajouter Supprimer à la fin de la matrice code> MarkersIndexes code>. Tous les éléments (après la position INSERT / Supprimer) obtiendront des valeurs à partir d'une position différente de marqueurs code> attribuée à. Je suppose qu'il y a beaucoup de stratégies pour faire face à cela, mais il n'y a pas assez de détails sur votre cas d'utilisation réelle et aurait probablement besoin d'une vaste analyse comparative. Vous pouvez également créer votre directive ngfor code> NGFOR CODE> avec un comportement différent si vous voulez plus de contrôle.
J'ai vu que vous utilisez la version Voici le code que j'ai utilisé pour faire mon test: p> composant principal p>
alpha37 code> qui reste une version alpha et vous pouvez avoir des bugs ... j'ai fait des tests à l'aide de la version
beta0 code> et il semble que travailler comme prévu. Je vous recommanderais donc de passer à cette version ... Nous nous attendons à ce que les versions bêta soient plus stables; -)
update() {
this.markers[1]= new Marker('m1a', 1);
}
marqueur code> objet de données p>
@Component({
selector: 'map',
template:`
<marker *ngFor="#m of markers" [model]="m"></marker>
<button (click)="update()">Update</button>
`,
directives:[MarkerComponent]
})
export class MapComponent {
constructor() {
this.markers = [
new Marker('m0', 0),
new Marker('m1', 1),
new Marker('m2', 2),
new Marker('m3', 3)
];
}
update() {
this.markers[1].name = 'm1a';
}
}
Marqueur code> Composant P>
@Component({
selector: 'marker',
template:`
<div class="marker">Marker {{model.name}} <button (click)="update()">Update</button></div>
`,
directives:[MarkerComponent]
})
export class MarkerComponent implements OnInit {
@Input() model: Marker;
constructor() {
}
ngOnInit() {
}
update() {
this.model.name = this.model.name + 'a';
}
}
mappe code> composant p>
class Marker {
name: string;
position: int;
constructor(name, position) {
this.name = name;
this.position = position;
}
}
Merci pour votre contribution. Avant de lancer la Bounty, j'ai mis à niveau vers la dernière version bêta. Cependant cela a donné les mêmes résultats.
Auriez-vous un repo d'où je peux tester? Merci!
J'ai fait des tests supplémentaires mais je ne peux pas reproduire votre problème. J'ai définitivement besoin de certaines choses (Plunkr ou Github Repo) pour pouvoir reproduire votre problème et essayer de trouver un correctif ;-)
Merci beaucoup pour cette réponse. C'est exactement ce que je cherchais. Question rapide, pourquoi incluez-vous MarkerComponent comme une directive dans MarkerComponent? Était-ce une erreur de copie et de pâte?
Quelques informations supplémentaires: lorsqu'un composant code> est créé, il crée en fait un marqueur sur une carte de la feuille. Lorsque le composant est mis à jour, le marqueur sur la carte doit mettre à jour