Uncaught Error: Value for is non-repeatable

Help Requests
1

I have an array of type Object in my Typescript. This is a variable called monthlyCancPoliciesFront. I make a call to my WebApi and in the chrome debugger I can see the data: node of my monthlyCancPoliciesFront is infact being populated from the Api response. However , in my html when I try to use "repeat.for=“policy of monthlyCancPoliciesFront” I get the error "aurelia-core.min.js:50 Uncaught Error: Value for ‘monthlyCancPoliciesFront’ is non-repeatable
" . Can any body tell me what I’m doing wrong, or what I need to do to fix it? Any help would be appreciated. below is the error and my Typescript ? - Jason

Code
@bindable public monthlyCancPoliciesFront: Object[];

        var step;
        for (step = 0; step < 9007199254740992; step++) {
            let PoliciesToCancel = await this._apiBatchRunDetail.GetCancellationDetailList(this.batchid);
            if (PoliciesToCancel['data'].length!=0) {
                this.monthlyCancPoliciesFront = PoliciesToCancel;
                this.countofmonthlyCancPoliciesFront = PoliciesToCancel['data'].length;
                return;
            }
            
        }

Error
aurelia-core.min.js:50 Uncaught Error: Value for ‘monthlyCancPoliciesFront’ is non-repeatable
at t.itemsChanged (aurelia-core.min.js:50)
at e.t [as selfSubscriber] (aurelia-core.min.js:28)
at e.call (aurelia-core.min.js:28)
at e.setValue (aurelia-core.min.js:28)
at t.set [as items] (aurelia-core.min.js:28)
at Object.setValue (aurelia-core.min.js:7)
at e.updateTarget (aurelia-core.min.js:13)
at e.call (aurelia-core.min.js:13)
at e.x [as callSubscribers] (aurelia-core.min.js:2)
at e.call (aurelia-core.min.js:28)

2

should be
this.monthlyCancPoliciesFront = PoliciesToCancel[‘data’];