Угловой контроллер в области ui router не изменяется при работе с ui modal

Question

Я путаюсь с областью действия в модульном контроллере ui при использовании «контроллера, как в маршрутизаторе ui. Я попытался использовать тот же контроллер (CompanyCtrl) как контроллер для модального, чтобы я мог добавлять новые созданные данные компании в существующий объем компании. В стороне функции openModal я назначаю область действия modalInstance, чтобы я мог использовать этот экземпляр для закрытия или делать все, что захочу, с помощью модального. Однако, когда я нажимаю кнопку закрытия, modalInstance в closeModal не определен каким-то образом.

//////// My company module and controller 
var CompanyCtrl = function ($modal) { 
    this.modalTitle = 'Create Company'; 

    this.openModal = function() { 
     this.modalInstance = $modal.open({ 
      animation: true, 
      controller: 'CompanyCtrl as lsmodal', 
      bindToController: true, 
      template: '<ls-modal><ls-create-company></ls-create-company></ls-modal>' 
     }); 
    }; 

    this.closeModal = function() { 
     console.log(this.modalInstance); // undefined ???????? 
    }; 
}; 

angular.module('company', []); 

angular.module('company').config(function ($stateProvider) { 

    /* Add New States Above */ 
    $stateProvider.state('master.company', { 
     url: '/company', 
     templateUrl: 'modules/company/company.html', 
     controller: 'CompanyCtrl as company' 
    }); 
}) 
.controller('CompanyCtrl', CompanyCtrl); 

//////// ls modal html 
<div class="modal-header"> 
<button type="button" class="close" ng-click="lsmodal.closeModal()">×</button> 
<h4 class="modal-title">{{lsmodal.modalTitle}}</h4> 

Мои вопросы

1. Поскольку они разделили контроллер, поэтому все, что я назначен this/scope в функции openModal больше нет в closeModal. Это потому, что я создаю еще одну новую область, используя CompanyCtrl as lsmodal. как это исправить?

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

Answer 1

1. Да, контроллеры не одиночки, поэтому каждый раз, когда вы назначаете контроллер для шаблона, вы можете эффективно создавать новый экземпляр. Я не уверен, что этого можно избежать. Именно поэтому вы видите неопределенные. Переменная this.modalInstance, которую вы пытаетесь распечатать в диалоговом контроллере, существует только в контексте родительского контроллера.

2. Контроллеры могут /? следует рассматривать как viewmodels - то есть они должны быть программным представлением представления. Если у вас разные взгляды, тогда имеет смысл иметь разные контроллеры. Если вам нужны данные в модальных, который существует в исходном контроллере, вы можете Alway «пропуск» данные через решает, как так:

var modalCtrl = function($scope, $modalInstance,DataYouExpectFromParentCtrl) { 

    $scope.data = DataYouExpectFromParentCtrl; 

    $scope.ok = function() { 
     $modalInstance.close(/* pass anything here that the parent will receive after OK */); 
    }; 

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



var CompanyCtrl = function ($modal) { 
    this.modalTitle = 'Create Company'; 

    this.openModal = function() { 
     var modalInstance = $modal.open({ 
      animation: true, 
      controller: 'ModalCtrl as lsmodal', 
      bindToController: true, 
      template: '<ls-modal><ls-create-company></ls-create-company></ls-modal>',  
      resolve: { 
       DataYouExpectFromParentCtrl: this.data; 
      } 
     }); 

     modalInstance.result.then(function (dataFromModal) { 
      // handle data returned if OK 
     }, function() { 
      // handle cancellation 
     }); 
    }; 
};