Angularjs: Как передать определенные данные модальным

Question

Я изо всех сил пытаюсь отобразить «вложенные» данные [array] в моем модальном формате. Я могу видеть все мои данные, извлеченные из URL в угловой, на моей странице просмотра. Однако, когда я нажимаю на один и тот же элемент, чтобы вытащить модальный вид, чтобы увидеть одну и ту же информацию о модальном, я не вижу некоторых сведений. В этом случае я не могу работать с сотрудниками или разработчиками.

URL выборка коды в угловом

**controller used is 'HomeController' 
**/comments is where my json data is located with 'employees' 
being a one-to-many relationship entity in my backend (which might be the issue in my head) 

var vm = this; 
vm.projects = []; 
$http.get('/comments') 
    .then(function(result) { 
     console.log(result); 
     vm.projects = result.data; 
    }); 

data, использованные в моем модальном шаблоне (не рабочий код в модальном)

<div ng-repeat="data in controller.projects"> 
     <ul ng-repeat="employee in data.employees"> 
      {{employee.name}} 
     </ul> 
    </div> 

controller приходит от <div ng-controller="HomeController as controller">

I также попробовали это;

<div ng-repeat="employee in Project.Employees" class="selected-item"> 
     {{employee.name}} 
    </div> 

но не работает!

Как видно ниже, на обычной странице отображаются employees.

Однако, когда я ng-click="editProject(data)" вышеупомянутую карту всплывал модальный, все остальное было показано выше (не показано ниже здесь) выскакивает за исключением сотрудников. Может ли это быть проблемой маршрутизации?

В основном все отлично работает на представлении шаблона, пока не выскочит модальный. Это код «модального выскакивания»;

$scope.editProject = function(data) { 
    $scope.showSelected = true; 
    $scope.SelectedProject = data; 
    var fromDate = moment(data.start).format('DD/MM/YYYY LT'); 
    var endDate = moment(data.end).format('DD/MM/YYYY LT'); 

    $scope.Project = { 
     ProjectID : data.projectID, 
     Client : data.client, 
     Title : data.title, 
     Description: data.description, 
     Employees: data.employees, 
     StartAt : fromDate, 
     EndAt : endDate, 
     IsFullDay : false 
    } 

    $scope.ShowModal() 
}, 

//This function is for show modal dialog 
$scope.ShowModal = function(){ 
    $scope.option = { 
     templateUrl: 'modalContent.html', 
     controller: 'modalController', 
     backdrop: 'static', 
     resolve: { 
      Project : function() { 
       return $scope.Project; 
      }, 
      SelectedProject : $scope.SelectedProject     
     } 
    }; 

Может ли быть обещание я пропускаю в ShowModalresolve?

Между тем, в chrome devtools employees, казалось, был «выбран», как показано ниже;

Однако при открытии объекта, интересно это говорит массив пуст;

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

Answer 1

вам необходимо пройти проекты в зависимости инъекций вам модальный контроллер экземпляра:

angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($uibModalInstance, projects) { 
    var $ctrl = this; 
    $ctrl.projects = projects; 

    $ctrl.ok = function() { 
    $uibModalInstance.close(); 
    }; 

    $ctrl.cancel = function() { 
    $uibModalInstance.dismiss(); 
    }; 
}); 

и разрешить его в функции открытия:

angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($http, $uibModal, $log, $document) { 
    var $ctrl = this; 

    $http.get('data.json').then(function(result) { 
    console.log(result); 
    $ctrl.projects = result.data; 
    }); 

    $ctrl.open = function (size, parentSelector) { 
    var parentElem = parentSelector ? 
     angular.element($document[0].querySelector('.modal-demo ' + parentSelector)) : undefined; 
    var modalInstance = $uibModal.open({ 
     ariaLabelledBy: 'modal-title', 
     ariaDescribedBy: 'modal-body', 
     templateUrl: 'myModalContent.html', 
     controller: 'ModalInstanceCtrl', 
     controllerAs: '$ctrl', 
     size: size, 
     appendTo: parentElem, 
     resolve: { 
     projects: function() { 
      return $ctrl.projects; 
     } 
     } 
    }); 
    }; 
}); 

пожалуйста, обратите внимание также передается, что имя контроллера с controllerAs, а не внутри HTML-шаблона.

plunker: https://plnkr.co/edit/wLI0pa07UNhr9Ld8CSg3?p=preview