AngularJS Nested ng-repeat with Grouping Lists

AngularJS Nested ng-repeat with Grouping Lists

In this Post We Will Explain About is AngularJS Nested ng-repeat with Grouping Lists With Example and Demo.Welcome on infinityknow.com – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to javascript – AngularJS nested ng-repeat with grouped lists
Example

In this post we will show you Best way to implement AngularJS Nested ng-repeat with Grouping Lists, hear for Grouping Nested ngRepeat Lists In AngularJSwith Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

Make a HTML file and define markup

    
    <title>
        Example of AngularJS Grouping Nested ngRepeat Lists steps
    </title>



    <h2>
        AngularJS Grouping Nested ngRepeat Lists Example
    </h2>
    <p>
        Close Group by:
        <a>user_gender</a> -
        <a>Hair</a>
    </p>

    <div>
        <h2>
            {{ c_group.label }}
        </h2>
        <ul>
            <li>
                {{ c_friend.user_name }}
            </li>
        </ul>
    </div>

Make a js file and define scripting

<a href="http://code.jquery.com/jquery-1.9.1.min.js">http://code.jquery.com/jquery-1.9.1.min.js</a>
<a href="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js">http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js</a>
    
        var liveApp = angular.module( "liveApp", [] );
        liveApp.controller(
            "liveCtrl",
            function( $scope, $timeout ) {

                function sortOn( collection, user_name ) {
                    collection.sort(
                        function( a, b ) {
                            if ( a[ user_name ] <= b[ user_name ] ) {
                                return( -1 );
                            }
                            return( 1 );
                        }
                    );
                }
                $scope.close_groupBy = function( params ) {
                    $scope.user_groups = [];
                    sortOn( $scope.close_friends, params );
                    var live_group_val = "_INVALID_GROUP_VALUE_";
                    for ( var i = 0 ; i < $scope.close_friends.length ; i++ ) {
                        var c_friend = $scope.close_friends[ i ];
                        if ( c_friend[ params ] !== live_group_val ) {
                            var c_group = {
                                label: c_friend[ params ],
                                close_friends: []
                            };
                            live_group_val = c_group.label;
                            $scope.user_groups.push( c_group );
                        }
                        c_group.close_friends.push( c_friend );
                    }
                };
                $scope.close_friends = [
                    {
                        user_name: "dinesh",
                        user_gender: "Male",
                        hobbies: "hockey"
                    },
                    {
                        user_name: "George dinesh",
                        user_gender: "Male",
                        hobbies: "hockey"
                    },
                    {
                        user_name: "nivrut",
                        user_gender: "Male",
                        hobbies: "hockey"
                    },
                    {
                        user_name: "Roshani",
                        user_gender: "Male",
                        hobbies: "cricket"
                    },
                    {
                        user_name: "ramjuda",
                        user_gender: "Female",
                        hobbies: "chess"
                    },
                    {
                        user_name: "Dhirubha",
                        user_gender: "Female",
                        hobbies: "cricket"
                    }
                ];
                $scope.user_groups = [];
            }
        );
    

Example

I hope you have Got What is ng-repeat group by filter angular 6 And how it works.I would Like to have FeadBack From My Blog(infinityknow.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(infinityknow.com) Are Most Always Welcome.