Question

我正在尝试向某个mdDialog显示一些有关某些订单的信息。当我将它作为主html页面的一部分时，此代码可以正常工作。试图在对话框中显示相同的信息，它不会显示除表格标题以外的任何内容。

有什么想法吗？

     function showDetails(event, order) {
        console.log(order);
        //show details
        $mdDialog.show({
            controller: DialogController,
            templateUrl: 'app/orders/directives/orderDetails.html',
            parent: angular.element(document.body),
            targetEvent: event,
            clickOutsideToClose: true,
            escapeToClose: true,
            locals:{
                itemsParent: order,
                three: 3
            },
            fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
        })
        .then(function(answer) {
        }, function() {});
    };

    function DialogController($scope, $mdDialog, itemsParent) {
        console.log(itemsParent);
        $scope.hide = function() {
            $mdDialog.hide();
        };
        $scope.cancel = function() {
            $mdDialog.cancel();
        };
        $scope.answer = function(answer) {
            $mdDialog.hide(answer);
        };
    }

templateurl：

<form>
<md-toolbar>
    <div class="md-toolbar-tools">
    <h2> Order Id:{{ itemsParent.orderid }}</h2>
    <span flex></span>
    <md-button class="md-icon-button" ng-click="cancel()">
    <i class="material-icons">clear</i>
    </md-button>
    </div>
</md-toolbar>
<md-dialog-content>
    <div class="md-dialog-content">
        <p>
            Ahsan:
            {{three}}
            <table class="table table-striped table-bordered">
                <thead>
                    <tr>
                        <th>Product Id</th>
                        <th>Name</th>
                    </tr>
                </thead>
                <tr ng-repeat="product in itemsParent.products">
                    <td>
                        <div>{{ product.productid }}</div>
                    </td>
                    <td>
                        <div>{{ product.name }}</div>
                    </td>                        
                </tr>
            </table>
        </p>
    </div>
</md-dialog-content>
<md-dialog-actions>
    <md-dialog-actions layout="row">
    <span flex></span>
    <md-button class="md-primary md-raised" ng-click="answer(close)">
    Close
    </md-button>
    </md-dialog-actions>
</md-dialog-actions>

Answer 1

在 DialogController 中执行此操作：

$scope.itemsParent = itemsParent;

如果它本身不起作用，那么也按如下方式更改对话框设置：

$mdDialog.show({
    controller: DialogController,
    templateUrl: 'app/orders/directives/orderDetails.html',
    parent: angular.element(document.body),
    targetEvent: event,
    clickOutsideToClose: true,
    escapeToClose: true,
    locals:{
        itemsParent: order,
        three: 3
    },
    fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
    scope: $scope,
    preserveScope: true
})

将对象传递给mdDialog templateUrl的问题

1 个答案: