ember.js -在模式中和在自己的路线上更新表单？
ember.js -在模式中和在自己的路线上更新表单？
提问于 2019-05-15 03:28:00
在3.x的Ember.js应用程序中，我想向用户显示现有屏幕上的更新表单重载。
现有的屏幕将位于路径‘\ screen’上，而更新表单将位于‘\screen\ update \carrots’上。如果更新是传统的表单，就不会有问题，但是如何在现有表单上显示覆盖的表单呢？这个有没有附加功能？
我正在使用bootstrap来设计ui样式，所以可以使用bootstrap模态，但我不确定如何将其应用到模板中？
我看到了许多插件，但它们似乎都是针对当前路由中出现的一种模式，并且出于身份验证/授权的原因，我希望为此更新操作提供一个单独的路由。
谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-05-15 03:39:47
有一个很好的插件，叫做ember-routable-modal
在您的路由中，您可以扩展它们的混合：
// app/routes/example.js
import Ember from 'ember';
import ModalRouteMixin from 'ember-routable-modal/mixins/route';
export default Ember.Route.extend(ModalRouteMixin, {
});然后使用一些特殊的标记：
// app/templates/example.hbs
<div class="routable-modal--dialog">
<div class="routable-modal--content">
<div class="routable-modal--header">
{{routable-modal-close-button class="routable-modal--close"}}
<h4 class="routable-modal--title">Modal title</h4>
</div>
<div class="routable-modal--body">
Content
</div>
</div>
</div>现在，每当您导航到/example时，通过常用的{{
- to }}帮助器或通过在路由中调用this.transitionTo()，示例模式将呈现在当前活动的路由之上。如果直接从/example URL加载页面，则最接近的父路由将呈现在模式下。
如果您愿意，您可以自由删除所提供的模板并构建您自己的对话框组件，该插件非常灵活。
如果你想使用你自己的插件，那就用这个插件作为灵感。这里的主要思想是利用renderTemplate路由挂钩在其他地方呈现
renderTemplate() {
this.render({
into: 'application',
outlet: 'routable-modal-outlet'
});
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56137340
复制相关文章
相似问题
腾讯云开发者
