Updating object properties with objects Angular

I am new to angular so forgive me if I use the incorrect terminology! I would also prefer any solutions using the latest Angular version if possible :-) I have some fairly complex use cases.

One of these is a customer edit screen. I have already built the list page and customer details forms, this works well. This also posts back some JSON. I have removed this from my example.

Something that a user must set is a customers stages which can be multiple. Therefore i will use checkboxes.

What I do is load the current user into the scope, then modify its values. then save to a web service. However i have some complex properties and figuring out how to bind these is problematic.

i found this example here which i can get to work if i put the options on my controller directly (shown in code)

http://ift.tt/ZoGJMg

however I cannot bind the check boxes on the currentUser.pipe properties. Any help would be greatly appreciated!

kind regards

jim

//our object definitions are here
function User(Firstname, Lastname, Id) {
this.Firstname = Firstname;
this.Lastname = Lastname;
this.PersonId = Id;
this.uuid = "OG6FSDHG6DF86G89DSHGDF8G6";

//hold the customers source
this.source = 2;

//these are used to populate our selection boxes
this.pipe = new Object();

//PROBLEM CODE IS HERE
//I WOULD LIKE TO OUTPUT A CHECKBOX FOR EACH ITEM AND THEN UPDATE THE SELECTED VALUE WHEN  A USER CLICK IT
this.pipe.stages = [
    { id: 1, text: 'STAGE 1', selected: true },
    { id: 2, text: 'STAGE 2', selected: false },
    { id: 3, text: 'STAGE 3', selected: true },
    { id: 4, text: 'STAGE 4', selected: false }
];

this.getFullName = function () {
    return this.Firstname + " " + this.Lastname + " " + Id;
};

}

function UserController($scope) {


//called to populate the customers list
$scope.populateCustomers = function () {

    //this will be populated form the server. I have extra code which allows     th euser ot select the customer and edit it and this works fine.
    //I have removed the superflous code
    $scope.userList = [
      new User("John", "Doe", 1),
      new User("Henri", "de Bourbon", 2),
      new User("Marguerite", "de Valois", 3),
      new User("Gabrielle", "d'Estrées", 4)
    ];
};

$scope.populateCustomers();

// the currentUser pobject is loaded by the user and modified. This works fine
$scope.currentUser = $scope.userList[0];

//if i add the stages here i can get them to update however these are different for each
//customer and would like the state to be held accordingly
$scope.stages = [
    { id: 1, text: 'STAGE 1', selected: true },
    { id: 2, text: 'STAGE 2', selected: true },
    { id: 3, text: 'STAGE 3', selected: true },
    { id: 4, text: 'STAGE 4', selected: true }
];

}