将动态数据传递给引导模态角4

我有一个对象列表，我正在将信息传递给引导模态。模式是这样的：将动态数据传递给引导模态角4

<button 
class="btn btn-primary btn-xs" 
data-toggle="modal" 
data-target="#matchModal" 
(click)="matchSearch()"> 
Select</button> 

<div class="modal fade" id="matchModal" tabindex="-1" role="dialog" aria- 
labelledby="myModalLabel"> 
<div class="modal-dialog" role="document"> 
<div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria- 
    label="Close"><span aria-hidden="true">&times;</span></button> 
    <h4 class="modal-title" id="myModalLabel">Card Matches</h4> 
    </div> 
    <div class="modal-body" *ngFor="let matchBrandCard of matchBrandCards"> 
    <div> 
     <input type="checkbox"> 
     <li>{{matchBrandCard.title}}</li> 
     <li>{{matchBrandCard.uuid}}</li> 
    </div> 
    </div> 
    <div class="modal-footer"> 
    <button type="button" class="btn btn-info">Create</button> 
    <button type="button" class="btn btn-success">Merge</button> 
    <button type="button" class="btn btn-default" data- 
dismiss="modal">Close</button> 
    </div> 
</div>

更新在我的组件：

matchBrandCards: Card[] = []; 

matchSearch() { 
this.clientCardsService.fetchBrandCards(this.clientCards.title).subscribe(
    clientCards => { 
    this.matchBrandCards = clientCards; 
    } 
);

}

clientCards是提供必要的参数为我的HTTP请求，然后将名单创建matchBrandCards。

我的问题是，信息会在第一次正确传递给模态，但是当我从列表中选择其他项目时，模态不会使用新的选定信息进行更新。一切都在更新我遍历的matchBrandCards来创建模态中的列表，但显示的值保持不变。寻找一种方法来实现我想要的功能。

建议||提示将非常感谢。

来源

2017-10-16 Brian Stanley

怎么样哟更新你的模态数据？ –

模态数据来自http请求，我将其分配给matchBrandCards –

您是否能够发布代码以声明和更新matchBrandCards变量？ –

更改到对象，并使用async：

<div class="modal-body" *ngFor="let matchBrandCard of matchBrandCards$ | async">

中包含的组件：

public matchBrandCards$ = new Subject();

，然后当你有一个更新：

updateHandler(values) { 
    this.matchBrandCards$.next(values); 
}

来源

2017-10-16 17:48:05 Meir

matchBrandCards已经有一个类型绑定到我的后端数据。 –

我知道，所以要么将其更改并将BE数据加载到可观察数据中，要么定义另一个可接受每个更新数据的可观察数据 – Meir

将动态数据传递给引导模态角4

回答

相关问题