我有 4 个按钮,它们调用模态 Bootstrap 窗口,当我这样做时,函数会使用 $scope 的变量加载 html-temptale,但是模态窗口不适用于 $scope,我之前问过这个问题,有回答使用指令,但坦白说我不明白它是如何工作的,这是一个例子
<div class="infBox" data-toggle="modal" data-target="#myModal" ng-click="modal('Modals/modal2', row.Name)">
<h4>BUILD</h4>
<div>
<img ng-class="{opac: row.Commit.Build.Debug == false}" src="IMG/computer-md.png">
<img ng-class="{opac: row.Commit.Build.Release == false}" src="IMG/computer-md.png">
</div>
<span class="debug">Debug</span><span>Release</span>
<span class="time">{{row.Commit.Build.Timefin}}</span>
</div>
这是 div 按钮
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
</div>
</div>
</div>
</div>
这是模态窗口
$scope.modal = function(path, name){
$scope.ModalObj = $scope.Objects[FindNumber(name, $scope.Objects)];
$http.get(path).success(function(data) {
$scope.modalData = data;
});
};
这是一个加载temptale的函数
<h4>BUILD</h4>
<div>
<img ng-class="{opac: ModalObj.Commit.Build.Debug == false}" src="IMG/computer-md.png">
<img ng-class="{opac: ModalObj.Commit.Build.Release == false}" src="IMG/computer-md.png">
</div>
<span class="debug">Debug</span><span>Release</span>
<span class="time">{{ModalObj.Commit.Build.Timefin}}</span>
这是诱惑
最佳答案
这是你的最后一篇文章,Nishi 很好地推荐了你!
Problems with modal and ng-bind-html
如果您不明白,请考虑一些建议。
- Angular 和 jQuery 可以并行工作,您可以填补这一空白,也可以使用任何一种技术。
- 如果您想使用 Bootstrap Modal,那么您需要使用 Angular Modal https://github.com/btford/angular-modal
正如 Nishi 在您的上一篇文章中发表的那样,我会很好地工作,您只需更改几行即可。
writeYourAppName.directive('modal', function () { return { template: 'Your Modal Window Code',
并使用 Controller 将值传递给模型
关于javascript - 如何在 Angular 中使用模态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30546026/