Question

我的router.js：

Router.map(function() {  
    this.route('dashboard', { path: '/' });
    this.route('list', { path: '/list/:list_id' }, function() {
      this.route('prospect', { path: 'prospect/:prospect_id', resetNamespace: true });
    });
});

list.hbs：

<div class="content-wrapper">
    <div class="content">
        {{prospect-list name=model.name prospects=model.prospects openProspect="openProspect"}}
    </div>
</div>

{{outlet}}

前景-list.hbs：

{{#each prospects as |prospect|}}
    {{prospect-item prospect=prospect openedId=openedProspectId openProspect="openProspect"}}
{{/each}}

前景-item.hbs

<td>{{prospect.firstName}}</td>
<td>{{prospect.list.name}}</td>

components / prospect-list.js

import Ember from 'ember';

export default Ember.Component.extend({  

    openedProspectId: 0,

    actions: {
        openProspect(prospect) {
            this.set('openedProspectId', prospect.get('id'));
            this.sendAction('openProspect', prospect);  
        }               
    }    
});

components / prospect-list.js

import Ember from 'ember';

export default Ember.Component.extend({  
    tagName: 'tr',
    classNameBindings: ['isOpen:success'],

    isOpen: Ember.computed('openedId', function() {
        return this.get('openedId') == this.get('prospect').id;
    }), 

    click: function(ev) {
        var target = $(ev.target);
        if(!target.is('input'))
        {       
            this.sendAction('openProspect', this.get('prospect'));
        }
    }

});

当我使用http://localhost:4200在浏览器中启动应用程序时，一切正常，但是当我从http://localhost:4200/list/27/prospect/88开始时当前加载的潜在客户（ID为88）未在潜在客户列表中突出显示，因为初始opensProspectId设置为0。

在这种情况下如何设置openedProspectId？

我可以在routes / prospect.js中获得这些id，如：

import Ember from 'ember';

import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';

export default Ember.Route.extend(AuthenticatedRouteMixin, {

    model(params) {
        return this.store.findRecord('prospect', params.prospect_id);
    },

    afterModel(params) {
        console.log(params.id); 
    }
});

但是如何将它传递给opensProspectId呢？或者我应该以另一种方式构建我的应用程序？

Answer 1

有一些事情可以在这里重新设计。我将首先使用link-to helper而不是在单击潜在客户时发送操作。这将为您提供统一的起点（路线），并允许用户在新窗口中打开潜在客户，如果他们决定。

路由自然会在控制器上设置属性model。您可以将其作为activeProspect传递给单个的潜在客户项目组件。然后在该组件中只需比较prospect.id == activeProspect.id以确定是否应突出显示该行。

我有一个单独的路线来强调潜在客户，这似乎很奇怪，但我并不知道您的业务需求。您可以考虑使用queryParams生成类似此list/27?prospect=88的网址，并为“完整视图”保留路线。前景。

Ember JS：如何在父组件中设置属性？

1 个答案: