ngx-bootstrap akkordeon öffnen Panel dynamisch

Question

Ich benutze ngx-bootstrap Akkordeon, um eine Liste von Blog-Posts anzuzeigen. Hier

ist die Vorlage:

<accordion id="blog-list"> 
    <accordion-group *ngFor="let post of posts; let first = first;" [isOpen]="first" id="post-{{post.id}}"> 
     <!-- Here goes content irrelevant to the question --> 
    </accordion-group> 
</accordion> 

ich auch einige globale config, um nur einen offenen Akkordeon-Panel zu einer Zeit haben.

export function getAccordionConfig(): AccordionConfig { 
    return Object.assign(new AccordionConfig(), { closeOthers: true }); 
} 

Wenn nun ein Post aktualisiert wird, ich es in der Liste aktualisieren, etwa so:

constructor(private elementRef: ElementRef, private postService: PostService) { 
    this.postService.updatedPost.subscribe(val => { 
     let i = this.posts.findIndex(post => post.id === val.id); 
     this.posts[i] = val; 
     let element = elementRef.nativeElement.querySelector('#post-' + val.id); 
     element.setAttribute('isOpen', true); // <- this does not work 
     element.scrollIntoView(true); 
    }); 
    } 

Aktualisierung und Scrollen funktionieren gut, aber ich kann nicht herausfinden, wie die Platte zu bekommen öffnen. Nachdem die Ansicht aktualisiert und gescrollt wurde, werden alle Bereiche geschlossen. Ich möchte, dass das Panel mit dem aktualisierten Post geöffnet wird.

Answer 1

So wird Problem in [isOpen]="first", wird zunächst Beitrag von Standard direkte Manipulation mit DOM wird

, was Sie tun können, ist Updates

keine Trigger-Bindungen geöffnet werden:

[isOpen]="activPostIndex === index"

activPostIndex = 0; 
constructor(private elementRef: ElementRef, private postService: PostService) { 
    this.postService.updatedPost.subscribe(val => { 
     this.activPostIndex = this.posts.findIndex(post => post.id === val.id); 
     this.posts[i] = val; 
    }); 
    }