Question

我试图更好地理解uibModal解析工作，我试图将一个值从主控制器传递给一个uibModal组件，当我点击其中一个项目时，我有一个对象集合（对象列表）我正在为所选对象分配一个活动键，然后在Modal组件上我需要一种方法来检查具有“active”的项：true所以对象的索引值可以从owlCarousel分配给startPosition设置。现在，每当我点击这些项目时，这将打开带有OwlCarousel的模态，并始终从0开始。如果用户点击索引值为4的项目，此值需要反映在活动的owl轮播项目上，我认为我有正确的设置，我可以获取索引值，但我无法从workModalComponent访问它。

this.works[indx].active = true;

然后获取项目的索引值：

this.indx = indx;

我正在使用以下函数调用模态：

      let modalInstance = this.$uibModal.open({
     windowClass: 'work-modal',
     size: 'lg',
     backdropClass: 'work-modal',
     component: 'workModal',
     resolve: {
          works: function() {
              return $ctrl.works; //passing the entire object collection to modal to display on a carousel
          },
          indx: function() {
              console.log('indx resolve', indx ); // need to pass this value to workModal component so this value can be assign to the carousel startPosition 
              return indx;
          }
      },
  });
  return modalInstance;

然后我有workModal组件，我试图根据用户从集合中选择的内容设置自定义活动元素：

         export function workModalComponent() {
       'ngInject';

       let component = {
         restrict: 'E',
         templateUrl: 'app/components/work-modal/work-modal.html',
         bindings: {
             resolve: '<',
             close: '&'
         },
         controller: workModalController,
         controllerAs: '$ctrl',
         bindToController: true
       };

       return component;
     }

     class workModalController {

       constructor (workFeed) {
         'ngInject';

           //this.indx = indx; HOW DO I GET THIS VALUE HERE ?

           this.works = workFeed.getWorks(); // DATA DIRECTIVE

           let active = '4'; //NEED THIS VALUE TO BE ASSIGN DINAMICALLY DEPENDING ON THE VALUE ASSIGNED FROM this.indx = indx;

           this.properties = {
             items: 1,
             autoplay: true,
             autoplayTimeout: 3000,
             loop: true,
             navSpeed: 500,
             dotsSpeed: 500,
             startPosition: active, // THIS VALUE NEEDS TO UPDATED
             responsive: {
                 0: {
                     dots: true,
                     nav: true
                 },
                 576: {
                     nav: true,
                     items: 1
                 },
                 768: {
                     nav: false,

                     dots: true,
                     items: 1
                 }
             },
             onChange: function () {
             }
         };

       }

     } //workModalController

将数据对象从uibModal解析为组件AngularJS的正确方法

0 个答案: