Question

我已经提供了下面的代码和Plunkr链接。当我点击“了解更多”按钮时问题可能无法正常显示问题。有人告诉我我哪里出错了。详情如下。好吧，如何添加更多细节。比如，你想要完成什么，你是怎么做的，你用这种方法遇到了什么困难，你尝试过另一种方法，等等。总之，没有代码也不是一个好问题，也不仅仅是代码。搜索余额！

代码：http://plnkr.co/edit/X8ReWNKXK9RLVvrzeTd5?p=info

 <body ng-app="myApp">
 <div class="container">
 <div ng-controller="listCtrl">
 <div class="well">
 <h1>Welcome to ssrikanthpp</h1>
 </div>
 <div class="row">
 <div class="col-sm-6" ng-repeat="x in data">
 <div class="well well-sm">
 <div class="row">
 <div class="col-md-6">
 <img ng-src="{{x.image_url}}" 
 class="img-rounded img-responsive well-image">
 </div>
 <div class="col-md-6">
 <h4>{{x.type}}</h4>
 <p><strong>Locations: </strong>{{x.locations}}</p>
 <p><strong>Size: </strong>{{x.size}}</p>
 <p><strong>Average Lifespan: </strong>{{x.lifespan}}</p>
 <p><strong>Diet: </strong>{{x.diet}}</p>
 <button class="btn btn-primary pull-right" data-toggle="model" target="#turtle-info">Learn more..</button> 
 </div>
 </div>
 <!-- row -->
 </div>
 <!-- well -->
 </div>
 <!-- col-xs-6 -->
 </div>
 <!-- model starts hre -->
 <!-- Modal -->
 <div id="turtle-info" class="modal fade" role="dialog">
 <div class="modal-dialog">
 <!-- Modal content-->
 <div class="modal-content">
 <div class="modal-header">
 <button type="button" class="close" data-dismiss="modal">&times;</button>
 <h4 class="modal-title">Modal Header</h4>
 </div>
 <div class="modal-body">
 <p>Some text in the modal.</p>
 </div>
 <div class="modal-footer">
 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
 </div>
 </div>
 </div>
 </div>
 <!-- model ends here -->
 </div>
 </div>

Answer 1

对不起，这不是一个真正的答案，但我不能发表评论，因为我刚开始做广告。

只需将目标重命名为数据目标。这应该可以解决问题。

Answer 2

更改此行 <button class="btn btn-primary pull-right" data-toggle="model" target="#turtle-info">Learn more..</button> 至 <button class="btn btn-primary pull-right" data-toggle="modal" target="#turtle-info">Learn more..</button> 你应该好好去

Modal没有弹出bootstrap.When我点击“了解更多”模式没有打开？有人能告诉我哪里出错了

2 个答案: