angular component inside template

3 posts, 1 answers
  1. Marcel
    Marcel avatar
    36 posts
    Member since:
    Apr 2011

    Posted 01 Jun Link to this post

    Hello,

    I'm using a angularjs component inside the ListView template like this:

    <!-- Categories Cardview template-->
     <script type="text/ng-template" id="categories-cardview-template">
     <div kendo-list-view="categoriesListView" class="eclub-cardview pager-offset" k-scope-field="cardView"
        
    k-options="$ctrl.listViewOptions">
          <div k-template>
            <eclub-category-card category="dataItem" on-select="$ctrl.selectionChanged(card)">
            </eclub-category-card>
          </div>
    </div>
     <div kendo-pager k-options="$ctrl.pagingOptions" class="eclub-cardview-pager"></div></script>

    The ListView is bound to a Kendo UI Datasource.
    I noticed when I add a new item to the Datasource ALL of angular components which are already available in the ListView get re-created.
    I tried several ways to add the new item to the Datasource (add, insert, pushCreate), but all with the same result.
    So you can imagine the performance hit when the ListView is already displaying let's say 20 items.

    Is this normal behavior of the ListView ?

    Thanks in advance

  2. Answer
    Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 03 Jun Link to this post

    Hi,

    I am afraid that this is so - the listview does a full re-render when the datasource changes. Notice however that using the listview component in angular context is not necessary, given the simpler ng-repeat built-in directive. Of course, the ng-repeat won't work with DataSource out of the box. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. William
    William avatar
    2 posts
    Member since:
    Oct 2015

    Posted 30 Nov in reply to Petyo Link to this post

    I could be mistaken but if you use an observablearray as your data you can remove and add from it without actually changing the datasource and no performance hit for recreating the widget.
Back to Top