ng-dialog不显示弹出窗口中的模板内容

时间:2017-02-07 08:21:52

标签: javascript angularjs

我想创建一个弹出窗口点击联系我们buttton。我正在使用ng-dialog 这是我正在使用的代码。

home.html的

点击此联系人美国按钮我需要一个弹出窗口。我的弹出窗口即将到来,但它没有显示contact_us模板的数据。

        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
             <button type="button"  class="form-control" ng-click="openContactForm()">ContactUS</button>
             </div>

        home.js
        This is my javascript class.

        var app= angular.module('myApp',['ngDialog']);

        app.controller('myCtrl', function($scope,ngDialog){

            $scope.openContactForm = function() {
                ngDialog.open({
    template: 'contact_us.html',
     className : 'ngdialog-theme-default',
    plain: true,
    scope: $scope
});

enter image description here

            };
        });

        Template which i want to display on click on contact us button

        Contact_us.html

        <!DOCTYPE html>
        <html>
        <head>
            <title></title>
        </head>
        <body>
        <div>
            <h2>Contact us<h2>
            <input type="text" placeholder="Name" ng-model="name" />
            <input type="text" placeholder="Email" ng-model="email" />
            <input type="text" placeholder="Mobile" ng-model="mobile" />
            <textarea placeholder="Enter your message or query..." ng-model="message"></textarea>
            <div class="ngdialog-buttons">
                <button type="button" class="ngdialog-button ngdialog-button-secondary" ng-click=closeThisDialog("Cancel")>Cancel</button>
                <button type="button" class="ngdialog-button ngdialog-button-primary" ng-click=confirm("OK")>OK</button>
                </div>
        </div>
        </body>
        </html>

1 个答案:

答案 0 :(得分:0)

将文件中的模板更改为false。

ngDialog.open({

template: 'contact_us.html',

className : 'ngdialog-theme-default',

plain: false,

scope: $scope

});

也可以使用简单的字符串作为模板和普通选项。