角度模态:动态更改模态内容

Question

如果在按钮单击事件中添加类型参数，我尝试更改模式内容。

    <button type="button" class="btn btn-default" ng-click="open('lg', 'type1')">Large modal</button>
    <button type="button" class="btn btn-default" ng-click="open('sm', 'type2')">Small modal</button>

所以，如果我选择type1模态或type2模态，内容不会相应地改变，模态内容只会改变为type2。我在我的脚本中是这样做的：

  var titleType1 = "Type 1 Title";
  var titleType2 = "Type 2 Title";
  var contentType1 = "Type 1 Content";
  var contentType2 = "Type 2 Content";
  if (type = 'type1') {  
  $scope.modalTitle = titleType1;
  $scope.modalContent = contentType1;
  }
  if (type = 'type2') {
    $scope.modalTitle = titleType2;
    $scope.modalContent = contentType2;
  }

http://plnkr.co/edit/9VWvsPw4PzflKZDII5H0?p=preview

知道如何修复吗？：）

Answer 1

有两个错误。

1。您将整个类型数组作为参数发送，而不仅仅是选择的类型。

   resolve: {
        type: function() {
          return type;
        }
      }

2. 将类型字符串与=而不是==进行比较

如果你改变这两件事，那么它就起作用了。

Answer 2

将控制器更改为此

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']);
    angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($scope, $uibModal, $log) {
      $scope.type = ['type1', 'type2'];
      $scope.animationsEnabled = true;
      $scope.open = function (size, type) {
        $scope.temp = type;
        var modalInstance = $uibModal.open({
          animation: $scope.animationsEnabled,
          template: "<div ng-include src="'myModalContent.html'"></div>",
          controller: 'ModalInstanceCtrl',
          size: size,
          resolve: {
            type: function() {
              return $scope.temp;
            }
          }
        });
        modalInstance.result.then(function () {
          $log.info('Modal dismissed at: ' + new Date());
        });
      };
      $scope.toggleAnimation = function () {
        $scope.animationsEnabled = !$scope.animationsEnabled;
      };
    });
    // Please note that $uibModalInstance represents a modal window (instance) dependency.
    // It is not the same as the $uibModal service used above.
    angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $uibModalInstance, type) {
      $scope.type = type;
    alert(type);
      $scope.cancel = function () {
        $uibModalInstance.dismiss('cancel');
      };
      var titleType1 = "Type 1 Title";
      var titleType2 = "Type 2 Title";
      var contentType1 = "Type 1 Content";
      var contentType2 = "Type 2 Content";
      if (type == 'type1') {
        $scope.modalTitle = titleType1;
        $scope.modalContent = contentType1;
      }
      if (type == 'type2') {
        $scope.modalTitle = titleType2;
        $scope.modalContent = contentType2;
      }
    });