Meteor:在何处放置$(';#modal';)。modal()调用在许多路由上自动显示相同的模式?

Meteor:在何处放置$(';#modal';)。modal()调用在许多路由上自动显示相同的模式?,meteor,twitter-bootstrap-3,modal-dialog,iron-router,Meteor,Twitter Bootstrap 3,Modal Dialog,Iron Router,我正在用Meteor开发一个应用程序。在几个页面上,我希望在用户导航到该页面时以编程方式显示bootstrap-3模式。模态将给出如何使用相应页面的说明。用户可以禁用此行为 读完这篇文章后,我认为最好的方法是用铁制路由器的挂钩 StepController = RouteController.extend({ onAfterAction: function() { var userSettings = Meteor.user().profile.settings; if(us

我正在用Meteor开发一个应用程序。在几个页面上,我希望在用户导航到该页面时以编程方式显示bootstrap-3模式。模态将给出如何使用相应页面的说明。用户可以禁用此行为

读完这篇文章后,我认为最好的方法是用铁制路由器的挂钩

StepController = RouteController.extend({
  onAfterAction: function() {
    var userSettings = Meteor.user().profile.settings;
    if(userSettings.showHelp) {
      $('#modal').modal();
    }
  }
});
模式会显示,但会导致页面无法使用,因为模式不会响应关闭页面的任何尝试

在评论中,我读到路由器除了路由用户和相关的安全检查之外,不应该用于任何事情

因此,我在Stack Overflow上找到的所有建议放置模式调用的位置如下:

  • 铁刨钩
  • 模板助手
  • 模板渲染挂钩

老实说,我很困惑。我将非常感谢有关这方面的概念和最佳实践的一些教学。

在反应式计算中使用
Router.current()
如何,该计算在每次路由更改时打开模式

Template.myTemplate.onRendered(function () {
  var c = this.autorun(function () {
    Router.current();

    // Launch your modal here
    var userSettings = Meteor.user().profile.settings;
    if(userSettings.showHelp) {
      // Opens modal after template is updated
      Tracker.afterFlush(function () {
        $('#modal').modal();
      });
    }
  });

  // Close existing modal when route changes
  c.onInvalidate(function () {
    $('#modal').hide();
  });
});
如果此模式用于所有路线,则可以将
Template.myTemplate
更改为布局模板,甚至可以更改为
Template.body


我在

中提供了一个工作示例,在反应式计算中使用Router.current()如何,该计算会在每次路由更改时打开模式

Template.myTemplate.onRendered(function () {
  var c = this.autorun(function () {
    Router.current();

    // Launch your modal here
    var userSettings = Meteor.user().profile.settings;
    if(userSettings.showHelp) {
      // Opens modal after template is updated
      Tracker.afterFlush(function () {
        $('#modal').modal();
      });
    }
  });

  // Close existing modal when route changes
  c.onInvalidate(function () {
    $('#modal').hide();
  });
});
如果此模式用于所有路线,则可以将
Template.myTemplate
更改为布局模板,甚至可以更改为
Template.body



我在

中提供了一个工作示例,路由器处理显示或不显示模式的责任似乎有点奇怪。为什么不使用模板助手呢?在我的应用程序中,我使用onrendered函数来显示模态,我从路由器读取哈希值,如“/url#showmodel”,如果发现哈希值,我将不显示模态,并且在onrendered函数中,dom将准备就绪,并且您在dom中有要显示的模态,就像其他人提到的一样,不要使用路由器来执行此操作。路由器只能用于根据路径和已通过的任何安全检查将当前用户路由到模板,并将数据发送到该模板。任何其他逻辑都应该在模板回调中完成。谢谢您的评论。我想知道路由器是不是最好的地方。如果我不想为每个显示模式的模板创建onrendered,而是将我的模式调用放在基础布局模板的onrendered中,那么它只会被调用一次,不会再被调用。你有办法解决这个问题吗?路由器处理显示或不显示模式的责任似乎有点奇怪。为什么不使用模板助手呢?在我的应用程序中,我使用onrendered函数来显示模态,我从路由器读取哈希值,如“/url#showmodel”,如果发现哈希值,我将不显示模态,并且在onrendered函数中,dom将准备就绪,并且您在dom中有要显示的模态,就像其他人提到的一样,不要使用路由器来执行此操作。路由器只能用于根据路径和已通过的任何安全检查将当前用户路由到模板,并将数据发送到该模板。任何其他逻辑都应该在模板回调中完成。谢谢您的评论。我想知道路由器是不是最好的地方。如果我不想为每个显示模式的模板创建onrendered,而是将我的模式调用放在基础布局模板的onrendered中,那么它只会被调用一次,不会再被调用。你有办法解决这个问题吗?路由器处理显示或不显示模式的责任似乎有点奇怪。为什么不使用模板助手呢?在我的应用程序中,我使用onrendered函数来显示模态,我从路由器读取哈希值,如“/url#showmodel”,如果发现哈希值,我将不显示模态,并且在onrendered函数中,dom将准备就绪,并且您在dom中有要显示的模态,就像其他人提到的一样,不要使用路由器来执行此操作。路由器只能用于根据路径和已通过的任何安全检查将当前用户路由到模板,并将数据发送到该模板。任何其他逻辑都应该在模板回调中完成。谢谢您的评论。我想知道路由器是不是最好的地方。如果我不想为每个显示模式的模板创建onrendered,而是将我的模式调用放在基础布局模板的onrendered中,那么它只会被调用一次,不会再被调用。你有办法解决这个问题吗?我试过了。我导航到路线a,模态显示。我导航到路线B,模式显示。我导航回路线A,页面被模式覆盖,但模式本身没有显示,因此无法与页面进行任何交互。引导模式在Meteor中很难处理。我用代码更新了答案,以处理未关闭的模式,并用一个工作示例处理回购。希望有帮助!我试过这个。我导航到路线a,模态显示。我导航到路线B,模式显示。我导航回路线A,页面被模式覆盖,但模式本身没有显示,因此无法与页面进行任何交互。引导模式在Meteor中很难处理。我用代码更新了答案,以处理未关闭的模式,并用一个工作示例处理回购。希望有帮助!我试过这个。我导航到路线a,模态显示。我导航到路线B,模式显示。我导航回路线A,页面被模式覆盖,但模式本身没有显示,因此无法与页面进行任何交互。引导模式在Meteor中很难处理。我用代码更新了答案,以处理未关闭的模式,并用一个工作示例处理回购。希望有帮助!