angular js project not working

Question

i am working on a small project with angular js(ps:this is the first time i'm using it )and i'm blocked by this error and i don't understand why

angular.module("jsonerator", [])
.controller('theController', function ($scope) {

    $scope.personld = {
        "@context": {
            "schema": "http://schema.org/"
        },
        "@graph": [
            {
                "@id": "person",
                "@type": "schema:Person",
            }
        ]
    }

    $scope.personld["@graph"][0]["schema:givenName"] = "";
    $scope.personld["@graph"][1]["schema:familyName"] = "";
}

Answer 1

To fix the error you need to add another object to your @graph array and it should work. The ["@graph"][1] will then be defined. The issue was that you only had one item in your array.

"@graph": [ 
   { "@id": "person", "@type": "schema:Person" }, 
   {} 
]

Answer 2

Your @graph array is only 1 element in length, so $scope.personld["@graph"][1] doesn't exist and the command $scope.personld["@graph"][1]["schema:familyName"] = ""; throws an error.