Angular -UI Модальное решение - программирование

Дорогой, все, что я новичок в Angularjs. Я создаю modal с Angular. Один из примеров, которые я нашел в Интернете, следует за тем, что я с трудом понимаю

$scope.checkout = function (cartObj) {
  var modalInstance = $modal.open({
  templateUrl : 'assets/menu/directives/payment-processing-modal.tmpl.html',
  controller : ["$scope", "$modalInstance", "cartObj", function($scope, $modalInstance, cartObj) {
  }],
  resolve : { // This fires up before controller loads and templates rendered
    cartObj : function() {
       return cartObj;
    }
  }
});

То, что меня смущает, это cartObj, который я уже получил как параметр для моей функции, передается моему контроллеру через инъекцию зависимости. Однако почему мне нужно создать функцию с именем cartObj и вернуть эту переменную. Это кажется запутанным. Кто-нибудь может помочь?

Ответ 1

Здесь разбиение по строкам:

$scope.checkout = function (cartObj) {

Создается переменная переменной $с именем checkout, которая ссылается на функцию, чтобы вы могли вызвать ее в виде как checkout() (например, с помощью кнопки с ng-click = "checkout" ).

Эта функция передается служба с именем cartObj.

var modalInstance = $modal.open({

Переменная с именем modalInstance используется для вызова метода открытия модальной службы.

Модальная служба UI Bootstrap $возвращает модальный экземпляр. Открытому методу передается объект, который определяет конфигурацию модального экземпляра следующим образом:

templateUrl : 'assets/menu/directives/payment-processing-modal.tmpl.html',

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

controller : ["$scope", "$modalInstance", "cartObj", function($scope, $modalInstance, cartObj) {
  }],

Это создает контроллер для модального экземпляра, которому передается $scope, услуга $modalInstance и, что важно, разрешенная служба cartObj.

Услуги - это синглтоны, которые используются для обмена данными между контроллерами. Это означает, что есть одна версия службы cartObj, и если один контроллер ее обновит, другой контроллер может запросить услугу и получить данные, которые были обновлены любым другим контроллером. Это здорово, но если переменная должна быть инициализирована некоторым значением из службы при загрузке контроллера, она вернет undefined, потому что она должна сначала спросить, а затем ждать, чтобы вернуть данные. То, где происходит решение:

  resolve : { // This fires up before controller loads and templates rendered
    cartObj : function() {
       return cartObj;
    }
  }
});

Причиной здесь для использования решения является, вероятно, потому, что сам шаблон зависит от некоторых данных из доступного cartObj КОГДА загружен шаблон. Resolve решит promises ДО ТОГО, как контроллер загружается, так что, когда он это делает, данные там и готовы. По сути, решение упрощает инициализацию модели внутри контроллера, потому что исходные данные передаются контроллеру вместо контроллера, который должен выйти и извлечь данные.

Разрешенный cartObj - это то, что передается в modalInstance, и поэтому его можно получить в контроллере как: cartObj.someproperty.