2016-06-13 176 views
0

我正在使用Ember版本2.5.1余烬复选框 - 选择1,并非全部全选

我已设置复选框,并且它们在选中时工作。但是,当我选择一个框时,对于一个用户,所有用户都会选中所有框。例如,如果我为Sophie选择一个团队(Speedy),那么每个复选框最终都会被检查并加入Speedy团队。我如何解决这个问题?做到这一点,每个人都可以在不同的团队中。

例如outwork是每个人的名字列表,(如果'Team Speedy'被勾选),每个人名字旁边是'Team Speedy'。

teams.hbs;

  <div class="container"> 
       <table class="table"> 
        <thead class="thead-inverse"> 
        <tr> 
         <th>Name</th> 
         <th>Team Speedy</th> 
         <th>Team Alpha</th> 
         <th>Team Invincible</th> 
        </tr> 
        </thead> 
        <tbody> 
        {{#each model as |signed-player|}} 
         <tr> 
          <td> {{signed-player.name}} </td> 
          <td> {{input type='checkbox' checked=speedy}} </td> 
          <td> {{input type='checkbox' checked=alpha}} </td> 
          <td> {{input type='checkbox' checked=invincible}} </td> 
         </tr> 
        {{/each}} 
        </tbody> 
       </table> 


      {{#each model as |signed-player|}} 
       <p><b>{{signed-player.name}}</b> is on the following team: <b>{{teamName}}</b></p> 
      {{/each}} 

      </div> 

控制器/ team.js

speedy: false, 
    alpha: false, 
    invincible: false, 


    teamName: function() 
    { 
    if (this.get('speedy')) { 
     return 'Team Speedy'; 
    } 
    else if (this.get('alpha')) { 
     return 'Team Alpha'; 
    } 
    else if (this.get('invincible')) { 
     return 'Team Invincible'; 
    } 
    else { 
     return 'No team yet'; 
    }; 
    }.property('speedy', 'alpha', 'invincible'), 
+0

我认为你的问题是,控制器是单身人士。这意味着即使用户更改,当您修改路线时,复选框仍会保持选中状态。因此,在setupController(控制器,模型)中的路由中尝试使用controller.set('speedy',null)重置它们 –

回答

1

主要的问题,我在你的例子中看到的,是你没有任何的玩家设置任何属性。你只计算一个属性{{teamName}},并且每个玩家只显示一次,这就是为什么点击一个复选框似乎改变了每个人的团队......实际上,实际上你并没有真正将任何玩家设置到任何团队中。

我看到的另一个问题是:您需要确定chackboxes是否适合您的选择。一个球员可以在多个球队上吗?如果是这样,那么复选框是好的..如果没有,那么选择框或一组无线电输入可能会更好。

所有这些......每个玩家对象/记录都需要一个实际存储代表他们属于哪个团队的值的属性。

您还需要从每个复选框/收音机/选择/任何实际设置所选值一个动作到播放器对象:

这是我的例子: https://ember-twiddle.com/1fe44ad4dc0494973c494a624ead79b7?fileTreeShown=false&openFiles=templates.application.hbs%2C

有一些事情发生在这里...但基本上我们正在做的是使用一个选择输入(对我来说......收音机)并使用来自输入的改变动作来设置每个特定玩家的属性...玩家对象开始。

我使用mut助手在我的行动中的例子..是一种快速的方式来设置模板行动中的值..如果你想使用复选框,而不是..你很可能想要替换mut帮助程序并在控制器中应用您自己的自定义操作。

请跟进,如果你需要/想要任何额外的陈述

+0

非常感谢!对于一个明智的解释和例子!并超越并解释如何选择或单选按钮会更好。我希望我能给你奖励积分:-)希望有人可以帮助你以及今后:-) – Pepper