Printing array of objects in table (Angular JS)

By : Freya

I have an array of objects like this one:

$scope.sales = [
{id: 15, location:'neverland'},
{id: 16, location:'farawayland'},
{id: 17, location:'highland'}

This array I am trying to display in a table, it should look like this:

id | location

15 | neverland

16 | farawayland

17 | highland

My html :

<input type="text" ng-model="sales[0].id">
<table class="table table-hover">
    <tr ng-repeat="x in sales">


The input field with value 15 gets printed. It works if I also ask the 2nd or 3rd value. But the table consists of 3 empty rows.

If I add an index (even <td>{{x[0].id}}</td>), I get a server error.

By : Freya


It works fine for me, check it here.

Maybe you are missing something else.

<!DOCTYPE html>
<html ng-app="app">

  <script type="text/javascript" src=""></script>
  <script type="text/javascript" src="script.js"></script>

<body ng-controller="Controller">
  <input type="text" ng-model="sales[0].id">
  <table class="table table-hover">
    <tr ng-repeat="x in sales">



var app = angular.module('app', []);

app.controller("Controller", ['$scope', function($scope) {

  $scope.sales = [{
    id: 15,
    location: 'neverland'
  }, {
    id: 16,
    location: 'farawayland'
  }, {
    id: 17,
    location: 'highland'


Another job for plain old for loop:

for url in testurl1, testurl2, testurl3
    req = Request(url)
        response = urlopen(req)
    except HttpError as err:
        if err.code == 404:
        # do what you want with successful response here (or outside the loop)
    # They ALL errored out with HTTPError code 404.  Handle this?
    raise err
By : wim

that would change the height of your box and align it center

    border-radius: 25px;
    border: 3px solid #fff;
    padding: 20px;
    width: 200px;
    max-height: 20px;
    margin:0 auto;
By : kdskii

This video can help you solving your question :)
By: admin