我正在使用 ngDialog 来显示/更新/删除详细记录。我的代码工作正常，但我不喜欢这样使用 $scope 的方式。$scope.newContact = this.newContact;
我想使用控制器或控制器作为语法，但不能让它工作。由于我使用的是 Typescript，我不喜欢这种 $scope 注入。任何建议将不胜感激。
// 更新：发布详细代码以进行澄清 我的场景是这样的： - ContactController 填充联系人列表 - 用户单击联系人或单击添加新 - 联系人控制器将显示 ngDialog - 用户更新联系人详细信息并按保存然后ContactController 被 ngController 回调，contactController 将更新列表。我只是希望能够在不使用 $scope 混乱的情况下将 this.newContact 传递给 ngDialog！
这是我用于上述场景的控制器代码：
module CRM.Contacts {
import GridConfigHelper = CRM.Common.GridConfigHelper;
export class ContactController implements IShowMaintenanceDetails, ICrudController<Contact> {
public contact: CRM.Contact;
public newContact: Contact;
public contacts: Contact[];
static $inject = ["$http", "CRM.Contacts.ContactService", "CRM.Common.PopupService", "ngDialog", "$scope"];
constructor(private $http: ng.IHttpService, private contactService: ICrudService<Contact>,
private popupService: CRM.Common.IPopupService,
private ngDialog: angular.dialog.IDialogService, private $scope: any) {
var contactGridConfig = GridConfigHelper.Init();
this.$scope.resource = contactGridConfig;
this.getAllRecords();
this.newContact = this.newDefaultRecord();
this.associatedRecordsShown = false;
}
showAddNewDetails(): void {
this.newContact = this.newDefaultRecord();
this.$scope.newContact = this.newContact;
this.showPopup(this.$scope); // Show ngDialog for adding new contact
}
newDefaultRecord(): Contact {
// Removed for brevity
}
selectRecord(index: number): void {
if (index !== this.newContact.RowIndex) {
this.associatedRecordsShown = false;
}
this.newContact = this.contacts[index];
this.newContact.RowIndex = index;
this.$scope.newContact = this.newContact;
this.showPopup(this.$scope); // Show ngDialog for updating / deleting
}
private showPopup($scope: any): void {
var result = this.ngDialog.openConfirm({
template: "/js/controllers/_MaintainContact.Html",
showClose: true,
className: 'ngdialog-theme-default custom-width',
scope: this.$scope
});
result.then(data => {
if (data === "save") {
this.saveRecord(this.$scope.newContact);
this.popupService.showSucesss("Record is saved successfully.");
} else if (data === "delete") {
this.deleteRecord(this.$scope.newContact);
this.popupService.showSucesss("Record is deleted successfully.");
}
});
}
deleteRecord(contactToDelete: Contact): void {
// Deletes a contact
}
saveRecord(contactToSave: Contact): void {
// Saves the contact that is passed from the ngDialog
}
getAllRecords(): Array<Contact> {
// returns all the contacts. removed for brevity
return this.contacts;
}
getRecord(id: number): CRM.Contact { throw new Error("Not implemented"); }
}
angular.module("CRM").controller("CRM.Contacts.ContactController", ContactController);
}
这是我的模板：
<div id="contactAddNew">
<!-- Changing this to form-horizontal makes all controls locked. If not then label alignment is not good! -->
<form class="form" id="addNewContactForm" name="addNewContactForm" ng-controller="CRM.Contacts.ContactMethodController as ContactMethod">
<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="newContact.FirstName" type="text" placeholder="First Name" class="form-control input-md">
</div>
</div>
<div class="form-group col-md-6 required">
<label class="col-md-4 control-label" for="website">Contact Method:</label>
<div class="col-md-8">
<select id="contactMethod" name="contactMethod" ng-model="newContact.ContactType"
ng-options="method.id as method.description for method in ContactMethod.contactMethodTypes" class="form-control input-md"></select>
</div>
</div>
// removed for brevity
<!-- 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" title="Save new record" data-toggle="tooltip" data-placement="right" name="submit"
ng-click="confirm('save')" 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="newContact.RowIndex < 0" class="btn btn-danger"
ng-click="confirm('delete')">
<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="closeThisDialog()">
<span class="glyphicon glyphicon-remove"></span>
</button>
</div>
</div>
</div>
</div>
</fieldset>
</form>