Angular.js каскадный выпадающий список - отображение двух моделей

В настоящее время я борюсь с отображением значения каскадного раскрывающегося списка - с данными, управляемыми деревом, построенным угловым контроллером, - в примитивную строку для отправки обратно на контроллер MVC.

У меня есть дерево данных для заполнения каскадного раскрывающегося списка, с основным форматом

public class Series
{    
    public string Text { get; set; }
    public virtual ICollection<Depth> Depths { get; set; }
}

public class Depth
{
    public int Id { get; set; }
    public double Value { get; set; }
    public string Text { get; set; }
}

Которая затем отображается с использованием углового выхода, который является моделью типа MVC:

public class LineItemViewModel
{
    public string Series { get; set; }
    public double Depth { get; set; }
}

Использование углового контроллера, где joistGroup - это список серий, заполненных при создании контроллера.

HTML:

<div class="initialRow row"
     ng-repeat="joist in floor.Joists">
    <select name="series" class="form-control" 
            data-ng-model="series"
            data-ng-options="s as s.Text for s in joistGroup.Series"
            data-ng-change="joist.Series = series.Text">
        <option></option>
    </select>
    <select name="depth" class="form-control"
            data-ng-model="depth"
            data-ng-options="d as d.Text for d in series.Depths"
            data-ng-change="joist.Depth = depth.Value;"
            data-rule-required="true">
        <option></option>
    </select>
</div>

Угловой контроллер:

var app = angular.module('MaterialListModule', []);
app.controller('MaterialListController', function($scope, $filter, $http) {
    $scope.getMaterialList = function() {
        $http.get('url for get call')
         .success(function(data, status, headers, config) {
            $scope.Model = data;
        });
    }

    $scope.getProducts = function (productSource) {   
        $http.get('url for get')
         .success(function (data, status, headers, config) {
            $scope.allItems = data;
            $scope.joistGroup = $filter('filter')($scope.allItems, { Text: 'Joists' }, true)[0];
        }).finally(function() {
            $scope.getMaterialList();
        });
    }

    $scope.getProducts("All");
});

В настоящее время я использую ng-change для запуска обновления примитива для отправки обратно на контроллер MVC, но поскольку это и страница создания и редактирования, это не работает, когда у меня уже есть выбранная серия. Я думаю, что могу заставить его работать с помощью ng-init, но не добился успеха.

Может ли кто-нибудь указать мне в направлении лучших практик, чтобы отобразить сложную модель для каскадных выпадающих списков в примитиве и обратно?