Join the Stack Overflow Community
Stack Overflow is a community of 6.4 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I cannot seem to put these into a scope.. And not sure if im doing something wrong...

HTML:

        <div class="col-md-10 pull-md-left" style=" width:102%;">
            <div class="row">

                <span style="text-decoration:underline;">EC2 Instances</span> <span style="clear:both;">refresh</span>

                    <table class="table-striped" style="width:100%;border:1px solid gray;">
                        <thead>
                            <tr style="border-bottom:1px solid black; background-color:black; color:white;">
                                <th title="ID" style="width:20px;">#</th>
                                <th title="Customer Attached">Customer</th>
                                <th title="Instance Name">Name</th>
                                <th title="Instance ID">ID</th>
                                <th title="Instance Type">Type</th>
                                <th title="Instance Availability Zone">Zone</th>
                                <th title="This is Title">State</th>
                                <th title="Public DNS">WAN_DNS</th>
                                <th title="Public IP">WAN_IP</th>
                                <th title="What Instasnce Was Booted Up">Started</th>
                                <th title="Security Groups">Security</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="ec2 in servers">
                                <td>{{ $index + 1 }}</td>
                                <td>{{ customerID }}</td>
                                <td>{{ instancename }}</td>
                                <td>{{ ec2.instanceID }}</td>
                                <td>{{ ec2.instanceType }}</td>
                                <td>{{ ec2.instanceAvailabilityZone }}</td>
                                <td>{{ ec2.instanceState }}</td>
                                <td>{{ ec2.publicdns }}</td>
                                <td>{{ ec2.publicip }}</td>
                                <td>{{ ec2.startdate }}</td>
                                <td>{{ ec2.secgroup }}</td>
                            </tr>
                            <tr ng-show="!ec2.length">
                            <td colspan="11" style="text-align:center;">
                                <BR>
                                No Instances have been syncronized.
                                <BR>    
                                <BR>
                            </td>
                            </tr>
                        </tbody>
                    </table> 
            </div>
        </div>


</div>

CONTROLLER:

<script>
var app = angular.module('myApp', []);
app.controller('ec2instanceCtrl', function($scope, $http) {
console.log('a test');
$http.get("ec2instances.php")
.then(function (response) {
            $scope.servers = JSON.parse(response.data);
            //$scope.servers = response.data.records;
            $scope.servers = results[0].ec2instance.map;
        }
    );
});

JSON:

{
"ec2instance": [{
    "ID": 0,
    "customerID": null,
    "ec2.instancename": "domain1.host",
    "ec2.instanceID": "i...",
    "ec2.instanceType": "x3large",
    "ec2.instanceAvailabilityZone": "us-east-1a",
    "ec2.instanceState": "running",
    "ec2.publicdns": "..com",
    "ec2.publicip": "127.0.0.1",
    "ec2.startdate": "11\/25\/2016 1:30AM",
    "ec2.secgroup": "open.ports"
}, {
    "ID": 1,
    "customerID": 2,
    "ec2.instancename": "server.com",
    "ec2.instanceID": "i2",
    "ec2.instanceType": "x5large",
    "ec2.instanceAvailabilityZone": "us-east-2c",
    "ec2.instanceState": "running",
    "ec2.publicdns": ".com",
    "ec2.publicip": "125.5.5.5",
    "ec2.startdate": "11\/1\/15 1:00am",
    "ec2.secgroup": "all"
}]

}

Now just trying to figure out the results and why it's not populating.... I am having no luck, is it because the JSON isnt properly formatted? Or am I not setting the scope correct?

Any help much appreciated!

share|improve this question

Do $scope.servers = JSON.parse(response.data).ec2instance, then $scope.servers should be an array containing your servers.

Assuming the parsed data is ok (try console.log($scope.servers) after the JSON.parse line), use the following notation in your ng-repeat instead:

<tr ng-repeat="s in servers">
    <td>{{ $index + 1 }}</td>
    <td>{{ s.customerID }}</td>
    <td>{{ s.instancename }}</td>
    <td>{{ s['ec2.instanceID'] }}</td>
    <td>{{ s['ec2.instanceType'] }}</td>
    <td>{{ s['ec2.instanceAvailabilityZone'] }}</td>
    <td>{{ s['ec2.instanceState'] }}</td>
    <td>{{ s['ec2.publicdns'] }}</td>
    <td>{{ s['ec2.publicip'] }}</td>
    <td>{{ s['ec2.startdate'] }}</td>
    <td>{{ s['ec2.secgroup'] }}</td>
</tr>
share|improve this answer
    
angular.js:12520 SyntaxError: Unexpected token o in JSON at position 1 ... Not sure why unexpected token? Could ya elighten me? I have put the changes you mentioned also in place. But not seeing anything weird like extra characters eg. whitespace – jburto121 23 hours ago
    
Keeps telling me $scope is undefined. Is that because its not mapping properly? – jburto121 22 hours ago
    
No idea about the undefined scope, that probably comes from some different code unless you changed something weird in your example. As for the parse error, try and console.log(typeof response.data) before parsing the data, to verify that the data is actually being received as a string and not JSON already – Fissio 22 hours ago
    
While we're at it, just console.log(response.data) to see if the data received is what you're expecting – Fissio 22 hours ago
    
Hmm, its saying: response datatype: object still complaining about unexpected token. – jburto121 22 hours ago

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.