title: How to set the height of the body equals to the length of an array in Angular
body: <p>I have this user list, which can grow dynamically if you add a new user. Now I want my whole body to be the length of the user list.</p>
  
  <p>In my factory I determine the length of the array and now I need to know how to access/translate this to the view in angular. Something like this:</p>
  
  <pre><code>&lt;div class="mainWrapper" id="mainView" style="width: {{gridSizeNG.x * 122}}px; height: {{gridSizeNG.y *  the length of the user list }}"&gt;
  
  ...
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Part of my factory code:</p>
  
  <pre><code>UserService.getUsers = function () {
          $http.get("api/users") //your API url goes here
              .success(function(dataFromServer){
                  //console.log('LOGGING DATADROMSERVER ', dataFromServer);
                  //UserService.userList = [];
  
                  /*dataFromServer.forEach(function(user, index, arr) { 
                      UserService.userList.push(user); 
                  })*/
                  var initials = function(name){
                      var d1 = name.split(" ")[0].charAt(0).toUpperCase();
                      var d2;
                      try
                      {
                          d2 = name.split(" ")[1].charAt(0).toUpperCase();
                      }
                      catch(e){
                          d2 = "";
                      }
  
                      return  d1 + d2;
                      console.log('LOGGING INITIALS ', d1 + d2);
                  }    
  
                  for (var i = 0; i &lt; dataFromServer.length; i++) {
                      UserService.userList[i] = dataFromServer[i];
  
                      UserService.userList[i].initials = initials(UserService.userList[i].name)                    
                  };
  
                  console.log('#### logging lenght of the userlist ' , UserService.userList.length );
  
                  //here you should update the usersList from the server like this:
                  //UserService.usersList = dataFromServer;
  
                  return dataFromServer;
              })
              .error(function(errorFromServer){
              //something went wrong, process the error here
                  console.log("Error in getting the users from the server");
              })
          };
  
        return UserService;
      })
  </code></pre>
  
  <p>As you can see from the image, the height of the body is now not dynamic 
  <a href="https://i.stack.imgur.com/NbbqF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NbbqF.png" alt="enter image description here"></a></p>