单击按钮无法打开模式

Question

I want to use modal for representing additional data on my table row contennt for this reason i use this code below , but when i press button modal doesn't pops up and i don't see any error in my browser console , what should i add to make my code work?:

    <script  cam-script type="text/form-script">
$scope.myFunc = function() {
      $('#myModal').modal('show');
    };
</script>
<h2>My job List</h2>                                                                                            
    <div>
        <table style="width:100%;"  class="table table-hover" >
            <thead>
                <tr>
                    <th style="width:80px; height:px;">chose</th>
                    <th style="width:140px;">id</th>
                    <th style="width:305px;">organizationNameEN</th>
                    <th style="width:250px;">cardNumber</th>
                    <th style="width:250px;"></th>
                    <th style="width:250px;"></th>

                </tr>           
            </thead>
            <tbody ng-repeat="item in arr" >
                <tr>
                    <td><input style="width:25px; height:25px;" type="checkbox" ng-model="chekselct"                                                     
                                                                cam-variable-name="isItemSelected"                                                  
                                                                cam-variable-type="Boolean" /></td> 
                    <td><input style="width:140px;" type="text" id="id" ng-model="item.id" readonly /></td>
                    <td><input style="width:305px;" type="text" id="organizationNameEN"  ng-model="item.organizationNameEN" /></td>
<td><input style="width:305px;" type="text" id="organizationNameGE"   ng-model="item.organizationNameGE" /></td>                     
                    <td><button type="button" class="btn btn-primary" style="height:30px" data-toggle="modal" data-target="#myModal">details</button></td>
                     <td><button ng-click="myFunc()" role="button" class="btn btn-large btn-primary">Detail</button></td>
                     <div class="modal fade" id="myModal" role="dialog">
       <div class="modal-dialog">
      <!-- Modal content-->
      <div class="modal-content" ng-repeat="item in arr">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Details</h4>
        </div>
        <div class="modal-body">
          <p ><label for="organizationNameEN"> organizationNameEN</label> :  <input style="width:305px;" type="text" id="organizationNameEN"  ng-model="item.organizationNameEN" /></p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>               
                </tr>
            </tbody>
        </table>
    </div>

Answer 1

尝试在您的按钮（带有ng-click =“ myFunc（）”的按钮）上进行操作，它将调用模式，而无需显式脚本。

<button role="button" class="btn btn-large btn-primary" data-toggle="modal" data-target="#myModal">Detail</button>

Answer 2

You can open it without using angular. Replace your code ng-click="myFunc()" with data-toggle="modal" data-target="#myModal" ... It should work