0

我有一个要求。我正在使用 Angularstrap Modal 进行模态对话（用户条款和条件）。

在这个模态对话中，有两个按钮是“同意”和“不同意”。

我有两个链接。单击每个链接会打开不同的视图。两个视图都与不同的控制器相关联。我的要求是，每当新用户到来时，我都需要打开条款对话，并且需要在两个链接的点击事件上打开。目前我必须在每个控制器中编写模态代码。（打开模态和模态按钮的功能相同）

现在，我想概括模态和模态按钮的代码。我想写一次，我想在需要打开（任何）模态时使用该代码

什么是方法或有可能？

4

1 回答 1

0

这是我的对话服务的骨架伪代码：

//modal container is the template with backdrop 
//and other modal elements (title, body, buttons, close button)
loadContainerTemplate() 
//the actual html content for the modal body
.then(loadDialogTemplate)
.then(init);

function init() {
  //append container to body
  //append dialog template to modal body
  //create new scope for the modal
  //set up buttons, title, width, etc.
  //listen for ESC keypress
  //initialize modal controller if needed
  //prepare close function (destroy scope, remove dom, execute close callbacks, etc)
  //compile modal html against scope
}

我的服务将接受模态模板的 url、标题、宽度、按钮及其回调、父范围等参数。在您的控制器中，您只需像这样调用对话框：

function($scope, Dialog) {
   Dialog({scope: $scope, templateUrl: 'path/to/modal/body', buttons: {
     'agree': agreeCallback,
     'disagree': disagreeCallback
   }, title: 'Modal title'});
}

或者你可以更进一步，创建 TermsModalService 抽象模板、按钮、回调、标题等细节，并使用底层的 Modal 服务来显示实际的对话框。条款模式将很容易在所有具有单线的控制器之间使用：TermsDialogService.show();

于 2013-11-14T07:31:01.593 回答