約束事を持つコントローラ間でデータを渡すAngularjs

Question

私は約束でいくつかの単純なブール値と文字列値を渡そうとしています。ここでは、ビュー内のモーダルをrenedering方法は次のとおりです。

$scope.openHjelpModal = function (field) { 

    var modalInstance = $uibModal.open({ 
     animation: true, 
     templateUrl: 'app/produkt/ny/views/hjelpModal.html', 
     controller: 'hjelpModalController', 
    }); 


    modalInstance.result.then(function (field) { 
     var kategori = ''; 
     var pakning = false; 
     var epd = false; 
     var lansering = false; 

     switch (field) { 
      case 'p': 
       console.log('pakningsoppbyggning rendering'); 
       pakning = true; 
       epd = false; 
       lansering = false; 
       kategori = 'pakningsoppbyggning'; 
       break; 
      case 'e': 
       console.log('epd-kategori rendering'); 
       pakning = false; 
       epd = true; 
       lansering = false; 
       kategori = 'EPD-kategori'; 
       break; 
      case 'l': 
       console.log('lansering rendereing'); 
       pakning = false; 
       epd = false; 
       lansering = true; 
       kategori = 'lansering'; 
       break; 
     } 
    }, function() { 
     //logService.info('Modal dismissed at: ' + new Date()); 
    }); 

}; 

私は何とかモーダルにブール値と文字列を渡す必要があります。私は推薦されたアプローチがサービスであることを知っていますが、ここまで提供されている解決策のどれにも従うことができませんでした。ここで

は、私は、モーダル（htmlファイル）で変数を使用する方法です。

<h4>Hjelp for: {{kategori}} </h4> 

<div ng-if="lansering"> 
    <p> kommer fra lansering</p> 
</div> 

<div ng-if="epd"> 
    <p> kommer fra epd</p> 
</div> 

<div ng-if="pakning"> 
    <p> kommer fra pakning</p> 
</div> 




<div class="modal-footer"> 
    <button class="btn btn-green pull-left" type="button" ng-click="lukk();">Lukk</button> 
</div> 

はhjelpModalControllerからコンソールログを実行している、これが答えで提供さの変化であり、undefinedを返します：

 $scope.openHjelpModal = function (field) { 

       var modalInstance = $uibModal.open({ 
        animation: true, 
        templateUrl: 'app/produkt/ny/views/hjelpModal.html', 
        controller: 'hjelpModalController', 
        resolve: function() { 
          return field; 
        } 
       }); 
       console.log(field); // works here 

    } 

そしてhjelpModalControllerから：

angular.module('app').controller('hjelpModalController', hjelpModalController); 
hjelpModalController.$inject = ['$scope','$uibModalInstance']; 

function hjelpModalController($scope, $uibModalInstance, field) { 
    console.log(field); // returns undefined 

} 

UPDATE：ここで

は、私が行った最新の進歩である：変数を渡す

コントローラ：変数が供給

$scope.openHjelpModal = function (field) { 
      var modalInstance = $uibModal.open({ 
       animation: true, 
       templateUrl: 'app/produkt/ny/views/hjelpModal.html', 
       controller: 'hjelpModalController', 
       resolve: { 
        selectedHelpModal: function() { 
         console.log(field); // correct output 
         return field; 
        } 
       } 
      }); 



      modalInstance.result.then(function() { 
       console.log('or here'); 
       console.log(field); // correct output 
      }); 
} 

コントローラ：

angular.module('app').controller('hjelpModalController', hjelpModalController); 

    hjelpModalController.$inject = ['$scope','$uibModalInstance']; 

    function hjelpModalController($scope, $uibModalInstance, field) { 
     console.log('hjelp modal controler is running'); 
     console.log(field); // undefined 
} 

Answer 1

実はuibModalこの目的のためにresolveのparamを提供。

var modalInstance = $uibModal.open({ 
    animation: true, 
    templateUrl: 'app/produkt/ny/views/hjelpModal.html', 
    controller: 'hjelpModalController', 
    resolve: { 
     field: function() { 
      return field; 
     } 
    } 
}); 

これは、上記のコードでは唯一の小さな変更はあり

.controller('hjelpModalController', function(field) { 
    console.log(field); 
}) 

Answer 2

（DI名は解決にキーの名前を次の）、あなたのモーダルコントローラ内部のDIでアクセスすることができます。

var modalInstance = $uibModal.open({ 
    templateUrl: 'app/produkt/ny/views/hjelpModal.html', 
    controller: 'hjelpModalController', 
    animation: true, 
    resolve: { 
     field: function() { 
      return field; 
     } 
    } 
}); 

モーダルコントローラで：

.controller('hjelpModalController', function(field) { 
    console.log(field); 
}) 

あなたはモーダルを却下したい場合は（おそらくあなたがします）モーダルコントローラへのparamとして$uibModalInstanceを追加します。

controller('hjelpModalController', function(field,$uibModalInstance) { 
    console.log(field); 
    $scope.cancel = function() { 
    $uibModalInstance.dismiss('cancel'); 
}; 



})