AngularStrap modal inside modal - modal-dialog

Question

Whit AngularStrap modal directive, is it possible to open another modal dialog inside/within a modal box?
What I'm trying to do is, open a modal box that contains a list of items to select. Inside this modal box there's a button to open another modal box to do a search on the item list.
But I got error when click on the button inside the modal box. Is there something I missed?
Here is a code sample on jsfiddle: http://jsfiddle.net/zeroxp/t3yv94d1/
<script type="text/ng-template" id="modal01.tpl.html">
<div class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h3>{{title}}</h3>
</div>
<div class="modal-body">
<table class="table table-hover">
<thead>
<tr><th>fruits <button class="btn btn-sm btn-info" data-bs-modal="modalSearch" data-template="modal02.tpl.html">search</button></th></tr>
</thead>
<tbody>
<tr data-ng-repeat="item in items" data-ng-click="itemSelected(item)"><td>{{item}}</td></tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-ng-click="$hide()">Close</button>
</div>
</div>
</div>
</div>
</script>
<script type="text/ng-template" id="modal02.tpl.html">
<input type="text" class="form-contorl"/>
</script>