javascript - 如何在 Angular 中使用模态

Question

我有 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">&times;</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>

这是诱惑

Answer 1

这是你的最后一篇文章，Nishi 很好地推荐了你!

Problems with modal and ng-bind-html

如果您不明白，请考虑一些建议。

1. Angular 和 jQuery 可以并行工作，您可以填补这一空白，也可以使用任何一种技术。
2. 如果您想使用 Bootstrap Modal，那么您需要使用 Angular Modal https://github.com/btford/angular-modal

3. 正如 Nishi 在您的上一篇文章中发表的那样，我会很好地工作，您只需更改几行即可。

   writeYourAppName.directive('modal', function () {
     return {
        template: 'Your Modal Window Code',
   

并使用 Controller 将值传递给模型