Question

我有一个表格并且填充了使用ng-repeat数据，这是从JSON

获得的

表格有姓名，电话和时间

当我点击名称时会弹出一个bootstrap模式，但我需要在bootstrap模式中选择名称

        <tbody>
        <tr ng-repeat='row in rows'>
            <td data-toggle="modal" data-target="#myModal" ng-modal="" > <a>{{row.name}}</a></td>

                 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                    <div class="modal-content">
                      <div class="modal-body">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">{{row.name}} Details</h4>
                      </div>
                    </div>
                </div>

            <td>{{ row.phone}}</td>
            <td>{{row.time}} </td>
        </tr>
    </tbody>

http://plnkr.co/edit/JX1hxzknZ0YIJKnzSGaf?p=preview

我希望表格的点击名称位于模态标题

上

感谢任何帮助。提前致谢

Answer 1

添加一个ng-click处理程序，将名称设置为范围属性。然后使用此属性作为模态标题的标题。

在生成表格的HTML中：

ng-click="setName(row.name)"

在你的控制器中： $ scope.selectedName = null;

$scope.setName = function(name) {
  $scope.selectedName = name;
}

然后你会将它用于你的模态标题

{{selectedName}}

Answer 2

最简单的方法是在控制器中添加一个函数，该函数将名称设置为当前作用域变量，然后在标题中显示该变量。请找到修改过的plunker的链接。

modified plunker

script.js：

$scope.getName = function(name) {
     $scope.fName = name;}

home.html的

<h4 class="modal-title" id="myModalLabel">{{fName}}</h4>

希望它有所帮助。

bootstrap模式应该选择从json（Angular）获取的表行

2 个答案: