Angularjs ui bootstrap模态没有弹出

时间:2016-05-21 11:57:55

标签: javascript angularjs angular-ui-bootstrap bootstrap-modal

我想展示一个带有产品详细信息的模态,但它没有弹出。我有状态路由控制器,产品控制器和产品列表页面以及产品详细信息页面。我的html和产品详细信息控制器的路由详细信息如下,

路由控制器 -

   .state('laptopdetails', {
     url:'/barbar/:productid',
     templateUrl: '/Selection_Routing/Selection_Product/ProductDetails.html',
     controller: 'ProductDetailsController'
    })

产品列表页面和产品详细信息控制器:

var app = angular.module('pageRoutingApp');
app.controller('ProductDetailsController', ['$scope', '$http', '$stateParams', '$uibModal', '$log', function ($scope, $http, $stateParams, $uibModal, $log) {
   
    //Open a modal to view product details..

    this.productdetails = function (size, selectedproduct) {

        var temp= selectedproduct;

        var modalInstance = $uibModal.open({                
            templateUrl: '/Selection_Routing/Selection_Product/ProductDetails.html',
            controller: function ($scope, $uibModalInstance, product) {

                $scope.product = product;
            },
            size: size,
            resolve: {
                product: function () {
                    return selectedproduct;
                }
            }
        });

        modalInstance.result.then(function (selectedItem) {
          $scope.selected = selectedItem;
        }, function () {
           $log.info('Modal dismissed at: ' + new Date());
        });
    };

    $scope.toggleAnimation = function () {
        $scope.animationsEnabled = !$scope.animationsEnabled;
    };
}]);
<div class="row">
        <div class="col-sm-6 col-md-3" ng-repeat="product in SiteProduct | filter:{ SubCategoryID: 1 }">
            <div class="thumbnail"> 
                <div class="caption">
                    <h3>{{product.ProductName}}</h3>
                    <p>{{product.ProductDescription}}</p>
                    <h4>{{product.Price}}  kr</h4>
                    <p><a ng-click="ProductDetailsController.productdetails('lg', product)" class="btn btn-primary" role="button">Details</a> <a ui-sref="#" class="btn btn-default" role="button">Buy</a></p>
                </div>


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

请注意我已经在这里参加了,但详细信息按钮不起作用...... enter image description here

0 个答案:

没有答案