代码之家  ›  专栏  ›  技术社区  ›  Az Emna

ember.js中列表中的mutlisect复选框

  •  0
  • Az Emna  · 技术社区  · 7 年前

    待办事项 选中该复选框时

    application.hbs

            {{#each model as |todo|}}
          <li class="list_shopping li_num_0_1">
    
                                <div class="col_md_3_list">
                                    <div class="cont_text_date">
    
                                            {{input type="checkbox"}}               
                                            {{todo.title}}
    
    
                                    </div>
    
                                </div>
                            </li>
                            {{/each}}
    

    application.js

     export default Route.extend({
          newTodo: "",
          actions: {
    
          model() {
            return this.store.findAll("todo");
          }
        });
    

    有什么想法吗? 我试过很多解决办法,但都不管用 https://guides.emberjs.com/v1.10.0/getting-started/marking-a-model-as-complete-incomplete/ https://ember-twiddle.com/b0e9cab25764e50c122ca482776bdae3?openFiles=routes.application.js%2C

    1 回复  |  直到 7 年前
        1
  •  0
  •   Thilina Dinith Fonseka    7 年前

    解决方法很简单。您需要做的是捕获从复选框的输入触发的事件。然后在控制器中,您需要捕获该事件并更改checked=true属性,然后它将获得checked的状态,您可以创建一个观察者来处理您列出的模型的属性。例子

    Todos have todo[] 
    todo has a property todo.isselected
    

    当您放入数组时,可以执行以下操作

      {{input type='checkbox' id='todo.id' checked=todo.isselected}}
    

    在控制器中,有一个观察者 todo.isselected (model.isselected-您使用的本地模型名称) 例子

    captureNameWhenSelected: observer ("todo.isselected", function(){
         arrayOfNames.pushObject( this.get('todo.id') ,this.get('todo.name'));
    })
    

    希望这将有助于解决您的问题