Повторная привязка дерева (дерева Wijmo) с помощью AngularJS

Я довольно новичок в AngularJS и действительно изо всех сил пытаюсь повторно связать дерево Wijmo (или даже дерево, реализованное с использованием элементов UL и LI с ng-repeat) с новыми данными об изменении значения поля со списком Wijmo (или даже обычный выпадающее меню выбора элемента HTML). Ниже приведен код, который я написал, который отлично работает при начальной загрузке страницы. Но при изменении раскрывающегося списка дерево не перезагружается с новыми данными, полученными методом loadDomainTree; он все еще показывает старые данные. Может ли кто-нибудь помочь мне понять, что не так с этим кодом?

HTML:

<div ng-controller="DomainCtrl">
    <select id="domain" ng-model="currentDomain" ng-options="item.Name for item in domainList"></select>
    <div>
        <ul id="wijtree">
            <li ng-repeat="item in domainEntityList" id={{item.Id}}>
                <a>{{item.Name}}</a>
            </li> 
        </ul>
    </div>                                                      
</div> 

JS:

$(document).ready(function ()
{
    $("#domain").wijcombobox({
        isEditable: false
    });

    $("#wijtree").wijtree();
});

function DomainDropdownModel(data) {
    this.Id = data.Id.toString();
    this.Name = data.Name;
};

function DomainTreeModel(data) {
    this.Id = data.Id;
    this.Name = data.Name;
};

function DomainCtrl($scope, $locale) {
    $scope.domainList = [];

    $.ajax({
        url: dropDownUrl,
        async: false,
        success: function (data) {
            $(data).each(function (i, val) {
                var domain = data[i];
                var domainId = domain.Id.toString();
                var domainName = domain.Name;
                $scope.domainList.push(new DomainDropdownModel({ Id: domainId, Name:  domainName }));
            });
        }
    });

    $scope.currentDomain = $scope.domainList[0];

    $scope.loadDomainTree = function (domainId) {
    domainEntitiesUrl = DOMAIN_API_URL + DOMAIN_ID_PARAM + domainId;
    //alert(domainEntitiesUrl);
    $scope.domainEntityList = [];
    $.ajax({
        url: domainEntitiesUrl,
        async: false,
        success: function (data) {
            $(data).each(function (i, entity) {
                var domainEntity = data[i];
                var domainEntityId = domainEntity.Id.toString();
                var domainEntityName = domainEntity.Name;
                $scope.domainEntityList.push(new DomainTreeModel({ Id: domainEntityId, Name: domainEntityName }));
                });
            }

        });
    };

    //Will be called on setting combobox dfault selection and on changing the combobox
    $scope.$watch('currentDomain', function () {
        $scope.loadDomainTree($scope.currentDomain.Id);
    });
}

person Tanmoy Sengupta    schedule 07.09.2013    source источник


Ответы (1)


Вы можете $watch для выбранного элемента WijCombobox, а затем соответственно повторно загрузить виджет. Вот код:

$scope.$watch('selectedItem', function (args) {
        if (args === 'Tree 1') {
                $("#wijtree").wijtree("option", "nodes", $scope.nodes1);
            }
            else {
                $("#wijtree").wijtree("option", "nodes", $scope.nodes2);
            }
   });

HTML-код

<wij-combobox data-source="treeList" selected-value="selectedItem">
            <data>
                <label bind="name"></label>
                <value bind="code"></value>
            </data>
 </wij-combobox>
person Ashish    schedule 24.09.2013