基于模型类型的 ember 组件

2023-12-20

我知道这有点重复,但我创建动态组件渲染器的所有努力都失败了,可能是由于我缺乏对 ember 概念的了解。

我的场景是一个多用途搜索栏,它将搜索缓存中的模型。我希望根据模型的类型键在搜索输入下方呈现每个搜索结果。车把文件将根据模型类型和语法命名components/app-search-<model-type-key>.hbs例如客户模型的模板名称应该是components/app-search-customer.hbs

我的搜索模板如下所示:

<div class="well well-md">
    <div class="input-group">
        {{input value=searchTerm class="form-control"}}
    </div>
    {{#if searchTerm}} <!-- Updating searchTerm causes results to populate with models -->
    {{#if results.length}}
    <ul class="list-group search-results">
        {{#each result in results}}
            <!-- todo -->
            {{renderSearchComponent model=result}}
        {{/each}}
    </ul>
    {{else}}
        Nothing here Captain
    {{/if}}
    {{/if}}
</div>

我对 renderSearchComponent 帮助器的尝试如下所示:

Ember.Handlebars.registerHelper('renderSearchComponent', function(model, options) {
    var modelType = options.model.constructor.typeKey,
        componentPath,
        component,
        helper;
    if (typeof modelType === 'undefined') {
        componentPath = "app-search-default";
    } else {
        componentPath = "app-search-" + modelType;
    }
    component = Ember.Handlebars.get(this, componentPath, options),
    helper = Ember.Handlebars.resolveHelper(options.data.view.container, component);
    helper.call(this, options);
});

当运行时 options.model 抛出:TypeError: options.model is undefined另外我还有以下错误:

Error: Assertion Failed: Emptying a view in the inBuffer state is not allowed and should not happen under normal circumstances. Most likely there is a bug in your application. This may be due to excessive property change notifications.

我已经眨了眨眼睛好几个小时了,试图把这件事做好。我所要求的可能吗?

先感谢您。


我知道这是一个老问题了,但是 Ember从 1.11+ 版本开始 http://emberjs.com/blog/2015/03/27/ember-1-11-0-released.html有新的组件助手 http://guides.emberjs.com/v2.1.0/components/defining-a-component/#toc_dynamically-rendering-a-component动态渲染组件。

{{#each model as |post|}}
  {{!-- either foo-component or bar-component --}}
  {{component post.componentName post=post}}
{{/each}}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

基于模型类型的 ember 组件 的相关文章

随机推荐