Nested html select


#1

Hello, i have 2 models:

// models\departament.js

            import DS from 'ember-data';
            export default DS.Model.extend({
                  name: DS.attr('string'),
                  project: DS.belongsTo('project'),
            });

// models\project.js
import DS from 'ember-data';

export default DS.Model.extend({

  name: DS.attr('string'),
  departaments: DS.hasMany('departament',{inverse: 'project'})
});

and template:

// templates\new.hbs

            <select class="form-control" onchange={{action "updateValueProject" value="target.value"}}>
            
              {{#each model.project as |q|}}
                  <option class="form-control"  value="{{q.id}}">{{q.id}} - {{q.name}}</option>

              {{/each}}

            </select>

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

        {{#each model.project.departaments as |d|}}
          <option class="form-control"  value="{{d.id}}">{{d.name}}</option>
        {{/each}}
      </select>

this dont work (( I want that when I select project it will update data in departament select field

I use Json api, how i can use :

"relationships": {
        "departaments": {
          "data": [
            {
              "id": "1", 
              "type": "departament"
            }, 
            {
              "id": "2", 
              "type": "departament"
            }, 
            {
              "id": "3", 
              "type": "departament"
            }
          ], 
          "links": {
            "related": "/api/project/1/departaments", 
            "self": "/api/project/1/relationships/departaments"
          }
        }
      }, 

sorry for my eng Может есть кто знает русский ?:slight_smile:


#2

I find out:

//controller

  proj: computed('project', function () {
    let a = this.get('project');
   // console.log('proj', a);
    return a;
  }),

  chooseDepartament: computed('proj', function () {
    let projectID = this.get('proj');
    let filt = [{"name":'project',"op":'has',"val": {"name": "id", "op":"eq", "val": projectID } }];
    let records = this.get('store').query('departament', {filter: {
      objects:  JSON.stringify(filt)
    }
    });

 
    //console.log('DEPACOOSE!!!: ', records);

      return records

}),

 updateValueProject(project) {
  this.set('project', project);

},