Angularjs ng-checked behaviour not consistent

I am using angularjs, and theres a edit view for one form, where I am trying to bind the previously used values. Below is my code/HTML. I am also using typescript for this and controller as format.

HTML:

<label ng-repeat="type in Ctrl.Types">
    <input type="radio" name="Type" ng-model="Ctrl.Foo.Type" ng-value="type.TypeId" required ng-checked="type.TypeName===Ctrl.Foo.TypeName" />
    {{ type.TypeName }} {{ type.TypeName===Ctrl.Foo.TypeName }}
</label>

Typescript JS For getting Foo

Foo:any;
getFoo = (Fooid) => {
    this.FooResource.getFooById(Fooid).then((response) => {
        this.Foo= response.data;
    });
};

I am getting all the values, everything is binding, except the radio buttons, I can see checked="checked" in html inspect element, I have also outputted expression along in html, which is also as expected, but i can not see radio selected(dot in radio) many times, sometimes it works, sometimes it doesnt. Types load at different times and Foo at different time.

I got this working by Adding a function in ng-checked instead of an expression and in that function, I returned true or false, and also set the ng-model to that selected value before returning, which was missing before as below.

<label ng-repeat="type in Ctrl.Types">
    <input type="radio" name="Type" ng-model="Ctrl.Foo.Type" ng-value="type.TypeId" required ng-checked="Ctrl.isTypeChecked(type)" />
    {{ type.TypeName }}
</label>

JS:

isTypeChecked = (t) => {   
    if (t.TypeName === this.Foo.TypeName) {
        this.Foo.Type = t.TypeId;
    }    
    return t.TypeName === this.Foo.TypeName;
};

getFoo is unchanged from before.