ng-click

Question

我正在尝试向我的Angular应用添加模式弹出窗口。虽然它列出了名称，但当我点击名称时，不会出现模态。以下是我的代码

HTML：

<div ng-app="app">
    <div ng-repeat="customer in customers">
        <button class="btn btn-default" ng-click="open(customer)">{{ customer.name }}</button> <br />

        <!--MODAL WINDOW--> 
        <script type="text/ng-template" id="myContent.html">
            <div class="modal-header">
                <h3>The Customer Name is: {{ customer.name }}</h3>
            </div>
            <div class="modal-body">
                    This is where the Customer Details Goes<br />
                    {{ customer.details }}
            </div>
            <div class="modal-footer">

            </div>
        </script>
    </div>  
</div>  

JS：

var app = angular.module('app', ['ngRoute','ui.bootstrap']);

app.config(function($routeProvider) {
    $routeProvider.
        when('/', {controller:testcontroller, templateUrl:'http://localhost/app/index.php/customer/home'}).
        otherwise({redirectTo:'/error'});
});

function test2controller ($scope, $modalInstance, customer) {
    $scope.customer = customer;
}

function testcontroller ( $scope, $timeout, $modal, $log) {

    $scope.customers = [
        {
            name: 'Ben',
            details: 'Some Details for Ben',
        },
        {
            name: 'Donald',
            details: 'Some Donald Details',
        },
        {
            name: 'Micky',
            details: 'Some Micky Details',
        }
    ];

    $scope.open = function (_customer) {

        var modalInstance = $modal.open({
            controller: "test2controller",
            templateUrl: 'myContent.html',
            resolve: {
                customer: function()
                {
                    return _customer;
                }
            }
        });
    };
}

有人能让我知道我在这里做错了吗？

Answer 1

控制器

$scope.saveFeed = function(feed){
    $('#exampleModalCenter').modal('show');
    console.log(feed);
}

HTML

<a class="dropdown-item p-3" href="#" ng-click="saveFeed(feed.id)">
    <div class="d-flex align-items-top">
        <div class="icon font-size-20"><i class="ri-save-line"></i>
        </div>
        <div class="data ml-2">
            <h6>Save Post</h6>
            <p class="mb-0">Add this to your saved items</p>
        </div>
    </div>
</a>

<!-- Modal -->

<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">

    <div class="modal-dialog modal-dialog-centered" role="document">

        <div class="modal-content">

            <div class="modal-header">

                <h5 class="modal-title" id="exampleModalCenterTitle">Modal title</h5>

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                    <span aria-hidden="true">&times;</span>

                </button>

            </div>

            <div class="modal-body">

                ...

            </div>

            <div class="modal-footer">

                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>

                <button type="button" class="btn btn-primary">Save changes</button>

            </div>

        </div>

    </div>

</div>