Question

当我更改选择框中的值时，是否有人可以指导我如何从数据库加载数据？我尝试了以下代码，但是当我尝试获取“值”并将其记录为“未定义”时。

我的Component.js

actions:{
 filterStudent(){
   let filterInputValue = this.get('value');
   console.log(filterInputValue);
   let filterAction = this.get('filter');
   console.log(filterAction);
   }
}

我的控制器

   actions: 
   {
     filterStudentResults(param) 
     {
       if (param !== '') 
       {
        return this.get('store').query('Students', { studentName: param });
       } 
       else 
       {
         return this.get('store').findAll('Students');
       }
     }
  }

我的Component.hbs

<select name="newType" onchange={{action "filterStudent" value="target.value"}} class="form-control">
      <option value="" disabled selected>Please Select</option>
      {{#each model.Students as |newStudents|}}
         <option value="{{newStudents.studentId}}">{{newStudents.studentName}}</option>
      {{/each}}               
</select>

将特定模板中的组件调用为

{{bind-dropdown model=model Filter=filterStudentResults}}

是EmberJS的新手并感谢任何帮助。在此先感谢：）

Answer 1

在My-Component.js中，没有value作为属性，你的意思是从onchange={{action "filterStudent" value="target.value"}}获取它然后你的行动应该接收参数，

actions:{
 filterStudent(selectedValue){       
   console.log(selectedValue);       
   }
}

我发现在向组件发送操作filterStudentResults时发现了另一个问题以下是错误的。 {{bind-dropdown model=model Filter=filterStudentResults}} 正如您在控制器中定义filterStudentResults一样，您可以创建闭包操作并将其发送到组件，因此它应该是，

{{bind-dropdown model=model filter=(action 'filterStudentResults')}}

应该使用组件操作中的selectedValue调用它，

actions:{
     filterStudent(selectedValue){           
       this.sendAction('filter',selectedValue);//this will call controller method with param 
       }
    }

Answer 2

首先，您需要检查模型是否准备就绪，您可以在路径的afterModel(model)挂钩中进行检查。

<select name="newType" onchange={{action "filterStudent" value="target.value"}} class="form-control">

应该重写，

<select name="newType" onchange={{action "filterStudent"}} value={{target.value}} class="form-control">

Answer 3

我的控制器没有从sendAction方法无效的组件中调用。

MyController.js

 actions: 
 {
    filterStudentResults(param) 
    {
     if (param !== '') 
     {
       return this.get('store').query('Students', { studentName: param });
     } 
     else 
     {
       return this.get('store').findAll('Students');
     }
   }
}

从模板调用组件如下

{{bind-dropdown model=model filter=(action 'filterStudentResults')}}

我的组件js

actions:{
  filterStudent(selectedValue){
    this.sendAction('filterPartsResults',selectedValue)
 }

我的Componet文件名是bind-dropdown，我的控制器名称是studentsController。模板名称是list-studentDetails。

在选择框onchange事件上从数据库加载数据

3 个答案: