Angular UI 日期選擇器未在禁用日期的函數中接收更新的范圍變量

Question

我正在將 AngularJS 與 Angular UI Bootstrap 一起使用。

我遇到了一個問題，起初我認為是范圍問題，然后是初始化問題，現在我不知道問題是什么。 我在這里發布了一個plunker，希望有人可以幫助我解決我的問題。

用戶案例如下：有人選擇了一個他們想要購買的甜甜圈。 如果那個甜甜圈不是每天都烤，那么模態會彈出並提示他們選擇一個日期來訂購。 我的問題是$scope.theActiveDonut似乎不知道$scope.theActiveDonut是什么，它只是在初始化時恢復為默認值，即奶油甜甜圈，即使我的控制台日志和angular.element($0).scope()告訴我$scope.theActiveDonut已更改。 您可以在console.log()看到這一點。

我的 plunker 在這里： http ://plnkr.co/edit/rziyPLvsiiZB346qmSC5?p=preview

如您所見， console.log()反映了$scope.theActiveDonut已更改，但是從$scope.thingy ， $scope.theActiveDonut始終是 Cream Donut。

Answer 1

您需要為 $modal 創建一個單獨的控制器，並使用以下命令將數據發送到該控制器

resolve: {
            theActiveDonut: function() { return $scope.theActiveDonut }
          }

初始化模態時。 然后從模態中，一旦選擇了日期並且用戶單擊“好的”，您應該modalInstanceII.close('making-a-new-one'); 或者如果他們點擊取消modalInstanceII.dismiss('canceled');

Plunkr： http ://plnkr.co/edit/mUIfZOeqj3r0zNw5rQDB?p=preview

Answer 2

模態實例不共享父控制器的范圍。 他們有自己的范圍。

為了將變量從調用控制器傳遞到模態實例，請使用解析：

modalInstance = $modal.open({
          animation: false,
          templateUrl: 'myModalContent.html',
          controller: 'MainController',
          scope: $scope,
          size: "lg",
          resolve: {
            theActiveDonut: function() { return $scope.theActiveDonut }
          }
        });