2014-09-30 2 views
0

У меня модальное всплывающее окно, которое содержит список флажков. Список элементов управления генерируется динамически из списка, а свойство ng-checked привязано к свойству Selected в моей модели списка.Почему мои привязки не привязаны к моему модальному всплытию bootstrap-ui angularjs?

Создание списка элементов управления отлично работает, если в обычном шаблоне, но когда я пытаюсь связать его в модальном всплывающем меню, элементы управления создаются, но свойство Selected не привязано правильно.

Вы можете увидеть в этом plunkr, что модель имеет установленное свойство Selected и при использовании флажка вызывается свойство Selected.

Я пробовал клонировать мои объекты в функции разрешения в родительском контроллере. Я подозреваю, что это связано с модальным окном, создающим 2 области действия, но я думал, что использование этой ссылки в качестве контейнера для моего модельного массива должно обойти это.

Вот код, который запускает мое модальное окно.

var modalInstance = $modal.open({ 
    templateUrl: 'modaltemplate.html', 
    backdrop: 'static', 
    controller: 'RoleModalController', 
    resolve: { 
     privileges: function() { 
     return $scope.privileges; 
     }, 
     role: function() { 
     return null; 
     } 
    } 
    }); 

Вот контроллер для модального.

.controller('RoleModalController', 
["$scope", "$modalInstance", "privileges", "role", 
function($scope, $modalInstance, privileges, role) { 
    $scope.form = {}; 

    $scope.privileges = privileges; 

    $scope.role = { 
    Name: null, 
    Description: null 
    }; 

    $scope.ok = function() { 
    $modalInstance.dismiss('ok'); 
    }; 

    $scope.cancel = function() { 
    $modalInstance.dismiss('cancel'); 
    }; 

    var init = function() { 
    if (!_.isNull(role)) { 
     $scope.role = role; 

     // for each privilege in the role, set Selected = true in the 
     // corresponding privilege in the in the privileges collection 
     _.each(role.Privileges, function(priv) { 
     var foundPriv = _.find($scope.privileges.all, function(p) { 
      return p.PrivilegeId === priv.PrivilegeId; 
     }); 
     _.extend(foundPriv, { 
      Selected: true 
     }); 
     }); 
    } 
    } 

    init(); 
} 

Вот звенеть из http://plnkr.co/edit/fvbHlF?p=preview

Edit: Я только что обновил мой шлепнуть, чтобы показать это «работает» за пределами модально, и это не так, возможно, это не проблема с дополнительным прицелы.

Благодаря

ответ

1

Я считаю, что проблема в том, как вы используете ng-checked директиву. Обратите внимание, что только если выражение, определенное на ng-checked, имеет значение true, специальный атрибут «checked» будет установлен на элементе. В вашем случае roleSelectionChanged() не оценивает true (вы, вероятно, хотели использовать ng-change).

Удалить директиву ng-checked из шаблона и он должен работать.

+0

Я смотрю на это в течение 2 дней. Вы на 100% правильны, и я также проработал это примерно через 20 секунд после того, как я разместил свое редактирование на вопрос. Невероятно, что чтение кода может быть достигнуто, а не просто предположить, что он делает. Спасибо, что нашли время ответить. – BenCr

Смежные вопросы