Understanding typescript interfaces

Oh, the issue with {} vs []: the former is an empty object and the latter is an empty array. In JavaScript, arrays are all objects but not all objects are arrays. Specifically, arrays have all the array methods like push() that you care about. If CountData is supposed to be an array, you can't assign {} to it, because it lacks the things arrays need.

Moving on the main part of your question:

The first problem here is that your interface

interface AllData {
  [value:string]:Row 
}

has a string index signature, which means "an AllData can have any number of keys of any string value whatsoever, and the property at each of those keys will be a single Row object".

Please note that the value in the above definition is just a placeholder and has no effect whatsoever on the type. It is the same exact definition as

interface AllData {
  [x:string]:Row 
}

Anyway, your problem is that the Data you are reading does not have that shape. It has a single key of exactly the name "value", and the property at that key is an array of Row objects. Meaning the following:

let Data: { value: Row[] };

Once you fix that, let's look at the smallest possible change to your code to get it working, and then improve from there:

const CountData: Row[] = [];
for (const rowData in Data["value"]) {
    CountData.push({
        eDate: Data["value"][rowData].eDate,
        mystate: Data["value"][rowData].mystate,
        mystateCity: Data["value"][rowData].mystateCity,
        numberofpeople: Data["value"][rowData].numberofpeople > 20 ? 20 :
          Data["value"][rowData].numberofpeople < 5 ? 5 : 
          Data["value"][rowData].numberofpeople,
    })
}

The loop for (const rowData in Data["value"]) iterates over the keys of the Data["value"] array. These are going to be the string values corresponding to the array indices: "0", "1", "2", etc. It is generally not recommended to iterate over arrays via for..in, because you'll get the indices as strings, possibly out of order, and with possible other unexpected things in there. Still, it sort of works.

The main issue here, though: since you are iterating over Data["value"]'s keys, you need to read its properties by indexing into Data["value"], not Data.

Let's stop iterating over array indices with for..of and use a regular for loop:

const CountData: Row[] = [];
for (let i = 0; i < Data["value"].length; i++) {
    CountData.push({
        eDate: Data["value"][i].eDate,
        mystate: Data["value"][i].mystate,
        mystateCity: Data["value"][i].mystateCity,
        numberofpeople: Data["value"][i].numberofpeople > 20 ? 20 : 
          Data["value"][i].numberofpeople < 5 ? 5 : Data["value"][i].numberofpeople,
    })
}

That is now guaranteed to happen in order and without any weird non-numeric indices.

Next improvements: let's stop saying Data["value"] since there's no reason to use bracket property access with a string literal that's a valid JavaScript identifier. You can just use Data.value.

Also, instead of writing Data.value[i] a bunch of times, just save it to its own variable (hey we can call that rowData now):

const CountData: Row[] = [];
for (let i = 0; i < Data.value.length; i++) {
    const rowData = Data.value[i]; 
    CountData.push({
        eDate: rowData.eDate,
        mystate: rowData.mystate,
        mystateCity: rowData.mystateCity,
        numberofpeople: rowData.numberofpeople > 20 ? 20 : 
          rowData.numberofpeople < 5 ? 5 : rowData.numberofpeople,
    })
}

Next, you might consider using a for...of loop to directly iterate over the rowData elements without having to care about their numeric indices:

const CountData: Row[] = [];
for (const rowData of Data.value) { 
    CountData.push({
        eDate: rowData.eDate,
        mystate: rowData.mystate,
        mystateCity: rowData.mystateCity,
        numberofpeople: rowData.numberofpeople > 20 ? 20 : 
          rowData.numberofpeople < 5 ? 5 : 
          rowData.numberofpeople,
    });
}

}

Next, copying individual properties is fine, but if you're going to copy all or most of the properties, you can use object literal spread syntax to do it quickly (or Object.assign() which is similar) and then just rewrite the one property you want to change:

const CountData: Row[] = [];
for (const rowData of Data.value) {
    CountData.push({ 
        ...rowData,
        numberofpeople: rowData.numberofpeople > 20 ? 20 : 
          rowData.numberofpeople < 5 ? 5 : rowData.numberofpeople
    })
}

}

Finally, if all you're doing is walking over one array and producing another array of the exact same size with each element in the input producing a single element in the output, you can dispense with looping and pushing entirely and use Array.prototype.map() instead:

const CountData = Data.value.map(rowData => ({
    ...rowData,
    numberofpeople: rowData.numberofpeople > 20 ? 20 : 
      rowData.numberofpeople < 5 ? 5 : rowData.numberofpeople
}));

}

Whew! I think that's as good as I can make it.

Playground link to code