Question

我正在使用带有ng-Dialog的Angular / Typescript。在这个阶段，ng-Dialog正如我想要的那样正确显示模板。但是，没有显示数据。场景是这样的：我有一个显示所有联系人列表的详细信息页面。用户单击它调用ContactController.selectRecord函数的联系人并传递所选行的索引。此函数查找指定的联系人并弹出对话框（直到此阶段一切正常，包括数据）。但是，弹出对话框时，不会显示值。代码如下（为简洁起见，代码已被修整）：

module CRM.Contacts {
 export class ContactController implements IShowMaintenanceDetails, ICrudController<Contact> {
    public newContact: Contact;
    public contacts: Contact[];

    static $inject = ["$http", "CRM.Contacts.ContactService", "CRM.Common.PopupService", "ngDialog"];

    constructor(private $http: ng.IHttpService, private contactService: ICrudService<Contact>,
                private popupService: CRM.Common.IPopupService, private ngDialog: angular.dialog.IDialogService) {
    }


    selectRecord(index: number): void {
        this.newContact = this.contacts[index];
        this.ngDialog.openConfirm({
            template: "/js/controllers/_MaintainContact.Html",
            showClose: true,
            className: 'ngdialog-theme-default custom-width',
            controllerAs: "VM", //tried ContactController as VM
            data: this.newContact // tried json.Stringify(this.newContact)
            // controller:this // tried
            // controller:"ContactController" // tried
        });
    }
}

}

_MaintainContat.Html中的代码（为简洁而修剪）：

<div id="contactAddNew" >


    <fieldset>

        <!-- Form Name -->
        <legend>Contact</legend>

        <div class="row">

            <div class="form-group col-md-6">
                <label class="col-md-4 control-label" for="id">ID:</label>
                <div class="col-md-8">
                    <input id="id" name="Id" ng-model="newContact.Id" type="text" placeholder="Id" ng-disabled="true" class="form-control input-md">
                </div>
            </div>

            <!-- Text input-->
            <div class="form-group col-md-6 required">
                <label class="col-md-4 control-label" for="firstName">First Name:</label>
                <div class="col-md-8">
                    <input id="firstName" name="FirstName" required="" ng-model="VM.newContact.FirstName" type="text" placeholder="First Name" class="form-control input-md">
                </div>
            </div>

            <!-- Text input-->
            <div class="form-group col-md-6 required">
                <label class="col-md-4 control-label" for="lastName">Last Name:</label>
                <div class="col-md-8">
                    <input id="lastName" name="LastName" required="" ng-model="VM.newContact.LastName" type="text" placeholder="Last Name" class="form-control input-md">
                </div>
            </div>

            <!-- Save / Cancel / Delete buttons -->
            <div class="row">
                <div class="form-group col-md-offset-8">
                    <label class="col-md-4 control-label" for="submit"></label>
                    <div class="col-md-8">
                        <button id="submit" type="submit" title="Save new record" data-toggle="tooltip" data-placement="right" name="submit" ng-click="VM.saveRecord(VM.newContact)"
                                class="btn btn-success" ng-disabled="addNewContactForm.$invalid">
                            <span class="glyphicon glyphicon-floppy-disk"></span>
                        </button>
                        <button title="Delete existing record" data-toggle="tooltip" data-placement="right" id="delete" ng-disabled="VM.newContact.RowIndex < 0" class="btn btn-danger" ng-click="VM.deleteRecord(VM.newContact)">
                            <span class="glyphicon glyphicon-trash"></span>
                        </button>
                        <button title="Cancel adding new" data-toggle="tooltip" data-placement="right" id="cancel" name="cancel" class="btn btn-danger" ng-click="VM.hideAddNewDetails()">
                            <span class="glyphicon glyphicon-remove"></span>
                        </button>
                    </div>
                </div>
            </div>

        </div>
    </fieldset>

我玩过ng-dialog的许多选项，即控制器：这个或控制器：“ContactController”，controllerAs：“ContactController as VM”甚至是controllerAs：“VM”，但它们都不起作用。

任何人都可以让我知道丢失的一点。任何意见将不胜感激。

下一步是将更新的数据从_MaintainContat.Html传递回ContactController。

任何帮助将不胜感激。

非常感谢

Answer 1

好的，终于搞定了。解决方案是设置ngDialog的范围：

 selectRecord(index: number): void {
        this.newContact = this.contacts[index];
        this.showAddNewDetailSectionIsShown = true;
        this.newContact.RowIndex = index;
        this.$scope.newContact = this.newContact;

        this.ngDialog.open({
            template: "/js/controllers/_MaintainContact.Html",
            showClose: true,
            className: 'ngdialog-theme-default custom-width',
            scope : this.$scope // This line did the trick
        });
    }

Angular和ngDialog问题，其中数据未显示，但对话框显示正确

1 个答案: