我有一个Meteor应用程序,我正在从IronRouter转换到FlowRouter.到目前为止一直很好,但有些方面我还不了解.
我的路线如下:
FlowRouter.route('/documents/:docId/edit', {
name: 'documentEdit',
subscriptions: function (params, queryParams) {
this.register('documentEdit', Meteor.subscribe('documentSingle', params.docId));
},
action: function (params, queryParams) {
BlazeLayout.render('layout', { top: 'header', main: 'documentEdit' });
},
});
Run Code Online (Sandbox Code Playgroud)
第一种选择:
然后我还有一个模板:
<template name="documentEdit">
<div class="container">
<h1>Edit document</h1>
{{#if isReady 'documentEdit'}}
{{#autoForm collection="Documents" doc=this id="documentForm" type="update" meteormethod="documentUpdateMethod"}}
<fieldset>
{{> afQuickField name='title'}}
{{> afQuickField name='content' rows=6}}
</fieldset>
<button type="submit" class="btn btn-primary">Update</button>
<a class="btn btn-link" role="button" href="{{pathFor 'documentsList'}}">Back</a>
{{/autoForm}}
{{/if}}
</div>
</template>
Run Code Online (Sandbox Code Playgroud)
使用模板助手如下:
Template.documentEdit.helpers({
isReady: function(sub) {
if(sub) {
return FlowRouter.subsReady(sub);
} else {
return FlowRouter.subsReady();
}
}
});
Run Code Online (Sandbox Code Playgroud)
这是在这里提到的,但我没有在UI上的文本框中预先填充值(这在编辑字段时是正常的).
第二种选择:
当我执行以下操作时,它可以工作,我不太明白为什么它可行(发现它在不同的论坛中浏览并尝试过):
<template name="documentEdit">
<div class="container">
<h1>Edit document</h1>
{{#with getDocument }}
{{#autoForm collection="Documents" doc=this id="documentForm" type="update" meteormethod="documentUpdateMethod"}}
<fieldset>
{{> afQuickField name='title'}}
{{> afQuickField name='content' rows=6}}
</fieldset>
<button type="submit" class="btn btn-primary">Update</button>
<a class="btn btn-link" role="button" href="{{pathFor 'documentsList'}}">Back</a>
{{/autoForm}}
{{/with}}
</div>
</template>
Run Code Online (Sandbox Code Playgroud)
和助手:
Template.documentEdit.helpers({
getDocument: function () {
return Documents.findOne();
}
});
Run Code Online (Sandbox Code Playgroud)
所以问题是:
Document.findOne()甚至不必传递我想编辑的文档的ID:您希望使用Flow Router进行模板级订阅,这是主要模式更改之一.
所以你要这样做:
在模板级别设置订阅.自动运行以便重新订阅路线更改.
Template.documentEdit.onCreated(function() {
var self = this;
this.autorun(function() {
var docId = FlowRouter.getParam('docId');
self.subscribe('documentSingle', docId));
};
};
Run Code Online (Sandbox Code Playgroud)
设置模板帮助程序以从路径中获取,并获取ID并填充帮助程序/文档.
Template.documentEdit.helpers({
getDocument: function () {
var docId = FlowRouter.getParam('docId');
var doc = Documents.findOne(docId) || {};
return doc;
}
});
Run Code Online (Sandbox Code Playgroud)
进行模板级加载检查,如果有渲染,否则显示加载...
<template name="documentEdit">
<div class="container">
<h1>Edit document</h1>
{{#if Template.subscriptionReady}}
{{#with getDocument }}
{{#autoForm collection="Documents" doc=this id="documentForm" type="update" meteormethod="documentUpdateMethod"}}
<fieldset>
{{> afQuickField name='title'}}
{{> afQuickField name='content' rows=6}}
</fieldset>
<button type="submit" class="btn btn-primary">Update</button>
<a class="btn btn-link" role="button" href="{{pathFor 'documentsList'}}">Back</a>
{{/autoForm}}
{{/with}}
{{else}}
Loading...
{{/if}}
</div>
</template>
Run Code Online (Sandbox Code Playgroud)