无法更新角度UI模态值返回给调用者屏幕 [英] Not able to update angular ui modal values back to the caller screen

问题描述

我试图调用angularUI模式，当我点击列表中的一个元素。我可以成功加载模式，在模式更改值，然后回来给调用者屏幕。但我不知道如何更新主叫屏幕上的列表中。我尝试过各种东西像里面的init（）调用程序画面的控制器的方法更新，但这并不被调用的模式接近。我试图指定为变量中的控制器但这并不能工作。我的猜测是需要的东西里面下面的方法做。

\r

\r

modalInstance.result.then（功能（personModified）{\r
    $ log.info（'personModified ='+ personModified.name +完成于：'+新的Date（））;\r
  }，函数（）{\r
    $ log.info（'模态在驳回：+新的Date（））;\r
  }）;\r
  };

\r

\r

\r

试过像下面通过循环：

\r

\r

modalInstance.result.then（功能（personModified）{\r
\r
  的for（int i = 0; I＆LT; modalCtrl.people.length;我++）{\r
    如果（modalCtrl.people [I] ._ ID === personModified._id）{\r
      modalCtrl.people [I] = personModified;\r
    }\r
  }\r
\r
  $ log.info（'personModified ='+ personModified.name +完成于：'+新的Date（））;\r
}，函数（）{\r
  $ log.info（'模态在驳回：+新的Date（））;\r
}）;\r
};

\r

\r

\r

但modalCtrl是不是里面modalInstance.result.then（函数（）{}）方法识别。我不知道还有什么能做些什么来更新我的来电显示屏幕上的列表中。任何帮助将是巨大的AP preciated。这里是plunker http://plnkr.co/edit/DR6Gadoh3rXegCrTOTzB?p=$p $ PVIEW

解决方案

随着当前元素，同时打开形态如 modalCtrl.open（'LG'，人，$指数）合格的数组元素索引，模态，当成功调用我们可以更新 this.people 特定指数的数组。

HTML

 ＆LT; D​​IV NG重复=人modalCtrl.people＆GT;
    ＆LT;一个NG点击=modalCtrl.open（'LG'，人，$指数）级=未加装饰的链接＆GT;
        ＆LT; p类=TEXT-中心＆GT; {{person.name}}＆LT; / P＆GT;
    ＆所述; / A＆GT;
＆LT; / DIV＆GT;
 

code

  modalCtrl.open =功能（大小，selectedPerson，指数）{    VAR modalInstance = $ modal.open（{
        templateUrl：myModalContent.html'，
        控制器：'ModalInstanceCtrl'，
        大小：大小，
        适用范围：$范围，
        解析：{
            负责人：函数（）{
                返回angular.copy（selectedPerson）;
            }
        }
    }）;    modalInstance.result.then（功能（personModified）{
        $ log.info（'personModified ='+ personModified.name +完成于：'+新的Date（））;
        modalCtrl.people [指数] = personModified;
    }，函数（）{
        $ log.info（'模态在驳回：+新的Date（））;
    }）;
};
 

工作Plunkr

希望这可以帮助你，谢谢你。

I'm trying to invoke angularUI modal when I click on an element of a list. I can successfully load the modal, change the value in the modal, and come back to the caller screen. But I don't know how to update the list on caller screen. I tried various things like updating inside init() method of the controller of caller screen but that doesn't get called on modal close. I tried to assign as variable inside controller but that doesn't work either. My guess is that something needs to be done inside below method.

  modalInstance.result.then(function(personModified) {
    $log.info('personModified = ' + personModified.name + ' Finished at: ' + new Date());
  }, function() {
    $log.info('Modal dismissed at: ' + new Date());
  });
  };

Tried looping through like below:

modalInstance.result.then(function(personModified) {

  for (int i = 0; i < modalCtrl.people.length; i++) {
    if (modalCtrl.people[i]._id === personModified._id) {
      modalCtrl.people[i] = personModified;
    }
  }

  $log.info('personModified = ' + personModified.name + ' Finished at: ' + new Date());
}, function() {
  $log.info('Modal dismissed at: ' + new Date());
});
};

But modalCtrl is not recognized inside modalInstance.result.then(function(){}) method. I don't know what else can I do to update my list on caller screen. Any help would be hugely appreciated. Here is the plunker http://plnkr.co/edit/DR6Gadoh3rXegCrTOTzB?p=preview

解决方案

Pass array element index along with the current element while opening modal like modalCtrl.open('lg', person, $index), when success call of modal we can update this.people array of that specific index.

HTML

<div ng-repeat="person in modalCtrl.people">
    <a ng-click="modalCtrl.open('lg', person, $index)" class="undecorated-link">
        <p class="text-center">{{person.name}}</p>
    </a>
</div>

CODE

modalCtrl.open = function(size, selectedPerson, index) {

    var modalInstance = $modal.open({
        templateUrl: 'myModalContent.html',
        controller: 'ModalInstanceCtrl',
        size: size,
        scope: $scope,
        resolve: {
            person: function() {
                return angular.copy(selectedPerson);
            }
        }
    });

    modalInstance.result.then(function(personModified) {
        $log.info('personModified = ' + personModified.name + ' Finished at: ' + new Date());
        modalCtrl.people[index] = personModified;
    }, function() {
        $log.info('Modal dismissed at: ' + new Date());
    });
};

Working Plunkr

Hope this could help you, Thanks.

这篇关于无法更新角度UI模态值返回给调用者屏幕的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！