Ionic + Angular unable to ion-radio to be checked by default

Question

I'm trying to check one from radio buttons in radio list, but without luck.

Could somebody tell me what i'm doing wrong?

Thanks for any help.

I tried to do it by this way:

<div class="list">

      <ion-radio ng-repeat="item in goalTypeList"
                 ng-value="item.value"
                 ng-change="goalTypeChanged(item)"
                 ng-checked="item.selected"
                 ng-model="data.clientSide">
          {{ item.text }}
      </ion-radio>

  </div> 

JS:

.controller('SettingsCtrl', function($scope, $ionicLoading) {

        $scope.goalTypeList = [
            { text: "Dials", value: "dials", selected: true },
            { text: "Conversations", value: "conversations" , selected: false  },
            { text: "Appointments", value: "appointments" , selected: false },
            { text: "Orders", value: "orders", selected: false  }
        ];

        $scope.data = {
            clientSide: 'ng'
        };

        $scope.goalTypeChanged = function(item) {
            console.log("Selected goalType, text:", item.text, "value:", item.value);
        };

Answer 1

It seems that the value of data.clientSide is not in the list goalTypeList. Change the value to match any..

html:

<div class="list">

  <ion-radio ng-repeat="item in goalTypeList"
             ng-value="item.value"
             ng-change="goalTypeChanged(item)"
             ng-checked="item.selected"
             ng-model="data.clientSide">
      {{ item.text }}
  </ion-radio>

js:

  .controller('SettingsCtrl', function($scope, $ionicLoading) {

    $scope.goalTypeList = [
        { text: "Dials", value: "dials", selected: true },
        { text: "Conversations", value: "conversations" , selected: false  },
        { text: "Appointments", value: "appointments" , selected: false },
        { text: "Orders", value: "orders", selected: false  }
    ];

    $scope.data = {
        clientSide: 'appointments'
    };

    $scope.goalTypeChanged = function(item) {
        console.log("Selected goalType, text:", item.text, "value:", item.value);
    };

Answer 2

The value in your $scope.data = { clientSide: 'ng' }; doesn't match any of the values in $scope.goalTypeList.

If the clientSide value on $scope.data was either dials, conversations, appointments or orders then the radio buttons should then load with one of the radio buttons selected.

I hope this helps.