【问题标题】:Display different data in collapsible panel body在可折叠面板主体中显示不同的数据
【发布时间】:2018-12-07 02:26:05
【问题描述】:

我正在努力将数据动态显示到多个可折叠面板主体中,以便在单击时将单个数据显示到每个主体中,但不知何故,每次单击时它都会为每个面板共享相同的数据。

我想做的是为每个项目显示单独的数据。这是我编写的示例代码。

<span ng-repeat="t in tabledata">
                <div class="bs-example">
                    <div class="panel-group" id="accordion">
                        <div class="panel panel-primary">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a data-toggle="collapse" data-parent="#accordion" href="#{{t.appSystemName}}">
                                        <table class="table borderless">
                                            <tr>
                                                <td>
                                                    <span class="glyphicon glyphicon-plus"
                                                        ng-click="getDataForProdQa(t.appSystemName)"
                                                        ng-model="plus">
                                                    </span>
                                                </td>
                                                <td>{{t.dbName}}</td>
                                                <td>{{t.appSystemName}}</td>
                                                <td>{{t.Id}}</td>
                                                <td>{{t.frequency}}</td>
                                                <td>{{t.timeStamp}}</td>
                                            </tr>
                                        </table>
                                    </a>
                                </h4>
                            </div>
                        </div>
                        <div id="{{t.appSystemName}}" class="panel-collapse collapse">
                            <div class="panel-body">
                                <table class="table table-responsive" >
                                    <tr ng-repeat="i in innertabledata">
                                        <td>{{i.dbName}}</td>
                                        <td ng-model="check">{{i.appSystemName}}</td>
                                        <td>{{i.Id}}</td>
                                        <td>{{i.frequency}}</td>
                                        <td>{{i.timeStamp}}</td>
                                    </tr>

                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </span>

寻求一些帮助来解决这个问题

【问题讨论】:

  • 你能用最低限度创建一个 plunker 吗?我们会更容易为您提供帮助
  • 不知道能不能创建。
  • 您需要展示最少的可行代码或更多,最好使用 plunker 或其他东西。这只是一个 HTML 模板,我们不知道问题是否在这里,它可能像错误的对象名称或属性名称一样简单。

标签: javascript angularjs twitter-bootstrap


【解决方案1】:

尝试使 id="accordion" 动态,因为它在 ng-repeat 下,并且每次重复相同的 id。所以使动态 id 像 id="accordion{{$index}}" 以及数据父让它充满活力。希望这会有所帮助。 谢谢

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-11-25
    • 2016-02-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多