@Thilina_Dinith_Fonse wrote:

I have following computed properties, tempate and a model where there are relationships which are async=true

ArrayController is used to sort the people-cards 1st after upgrading to 2.1.8 its not working. how to achieve this ?

export default Mixin.create( {
  animate: true,
  filterText: '',
  filter: 0,
  filterTabs: A(),
  card: null,
  changeofperson:null,
  people:A(),

  people: computed(
    'model.coordinators.[]',
    'model.directors.[]',
    'model.professors.[]',
    'model.students.[]',
    'model.advisors.[]',
    'model.managers.[]',
    'model.contacts.[]',
    'model.consultants.[]',
    'model.guests.[]',

    function() {
      debugger;
      var people = A();
      this.get( 'model.coordinators.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'coordinators', title:'Coordinator', selected:false } ) );
      } );

      this.get( 'model.professors.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'professors', title:'Faculty', selected:false } ) );
      } );

      this.get( 'model.guests.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'guests', title:'Guest', selected:false } ) );
      } );

      this.get( 'model.students.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'students', title:'Participant', selected:false } ) );
      } );

      this.get( 'model.advisors.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'advisors', title:'Programme Advisor', selected:false } ) );
      } );

      this.get( 'model.directors.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'directors', title:'Programme Director', selected:false } ) );
      } );

      this.get( 'model.consultants.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'consultants', title:'Programme Consultant', selected:false } ) );
      } );

      this.get( 'model.contacts.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'contacts', title:'Programme Contact', selected:false } ) );
      } );

      this.get( 'model.managers.[]' ).forEach( function( person ) {

        people.pushObject( Ember.Object.create( { person:person, id:person.id, role:'managers', title:'Programme Management', selected:false } ) );
      } );

      return people;

    }),


    sortedPeople: computed('people', function() {
      debugger;
      return this.get('people').sortBy('person.lastName')
    }),

    peopleWithoutDuplicates: computed( 'sortedPeople' ,function() {

      var dedupedPeople = {},
      people = this.get( 'people' );

      people.forEach( person => dedupedPeople[ person.id ] = person );

      return Object.keys( dedupedPeople ).map( id => dedupedPeople[ id ] );
    } ),

      groupedPeople: computed( 'peopleWithoutDuplicates', 'filter', function() {

        var people    = this.get( 'peopleWithoutDuplicates' ),
        tabPeople = A(),
        getFilter = this.get( 'filter' ),
        arrayController;

        if ( getFilter === 0 || getFilter === 1 ) {

          tabPeople.pushObjects( people.filterBy( 'role', 'coordinators' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'directors' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'professors' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'advisors' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'managers' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'contacts' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'consultants' ) );
          tabPeople.pushObjects( people.filterBy( 'role', 'guests' ) );
        }

        if ( getFilter === 0 || getFilter === 2 ) {

          tabPeople.pushObjects( people.filterBy( 'role', 'students' ) );
        }

        // arrayController = Ember.Controller.create( {
        //
        //   model: tabPeople,
        //   sortProperties: [ 'person.lastName' ],
        //   sortAscending: true
        // } );

        return tabPeople;
      } ),

      filteredResults: computed( 'filterText', 'groupedPeople.[]', function() {

        var sortedArr =this.get('groupedPeople')
        var filter = this.get( 'filterText' ).replace( /\s+([^\s]+)/, '|$1' ).replace( /\s+$/, '' ),
        regExp = new RegExp( filter, 'i' ),

        filteredResults = sortedArr.filter( function( result ) {
          return regExp.test( result.get( 'person.fullName' ) );
        } );

        return filteredResults;
      } ),

      person: Ember.computed( 'card.person', function() {

        return this.get( 'card.person' );
      } ),


    } );

template.hbs

{{#each filteredResults as |result|}}
    <div class="grid--column grid--column-3">

      {{people-card card=result loaded=result.person.isLoaded openProfileAction="openProfile" profileLoadedAction="personLoaded" }}

    </div>
  {{/each}}

model

{
    coordinators: DS.hasMany( 'profile', { async: true } ),
    directors: DS.hasMany( 'profile', { async: true } ),
    professors: DS.hasMany( 'profile', { async: true } ),
    students: DS.hasMany( 'profile', { async: true } ),
    advisors: DS.hasMany( 'profile', { async: true } ),
}

im trying to show a sorted list of people-cards in template ( sort by lastname ) . this works under ember 1.13 but when i upgraded to ember2.18.x im getting an error ArrayController is depreciated. how to achive the sorting for those async=true relationships to work this again ?

Posts: 1

Participants: 1

Read full topic