Angulaire de bootstrap de l'interface utilisateur modal de la portée de la liaison avec les parents

Je vais avoir Angulaire problème de l'obtention d'un modal portée de supprimer la liaison de la portée parent. Je veux que le champ d'application objet que je passe dans la modale d'être distincte de la portée correspondante de l'objet.

N'importe comment j'structure modale de l'objet parent les miroirs. La seule solution que j'ai trouvé est de changer l'objet de la propriété des noms, mais qui serait lourd de le faire pour chaque modal dans mon projet.

Par exemple, je peux avoir un $portée variable dans le parent $champ d'application.parentData.prénom et un modal variable $scope.modalData.un.b.c.prénom, et le parent de refléter la valeur dominante.

Je suppose qu'il est un parent de l'enfant $questions de portée, d'ici que je ne suis pas arriver.
Voici une plunk illustrant la question:

http://plnkr.co/edit/5naWXfkv7kmzFp7U2KPv?p=preview

HTML:

<div ng-controller="ModalDemoCtrl">
    <script type="text/ng-template" id="myModalContent.html">
        <div class="modal-header">
            <h3>I'm a modal!</h3>
        </div>
        <div class="modal-body">
                <input ng-model="modalData.a" />
                <input ng-model="modalData.b" />
                <input ng-model="modalData.c" />
            Selected: <b>{{ sourceData }}</b>
        </div>
        <div class="modal-footer">
            <button class="btn btn-primary" ng-click="ok()">OK</button>
            <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
        </div>
    </script>

    <button class="btn btn-default" ng-click="open()">Open me!</button>
    {{sourceData}}
    <div ng-show="sourceData">Selection from a modal: {{ test }}</div>
</div>
  </body>
</html>

JS:

angular.module('plunker', ['ui.bootstrap']);
var ModalDemoCtrl = function ($scope, $modal, $log) {

  $scope.sourceData = {a:'abc',b:'bcd',c:'cde'};

  $scope.open = function () {

    var modalInstance = $modal.open({
      templateUrl: 'myModalContent.html',
      controller: ModalInstanceCtrl,
      resolve: {
        data: function () {
          return $scope.sourceData;
        }
      }
    });

    modalInstance.result.then(function (selectedItem) {
      $scope.scopeData = selectedItem;
    }, function () {
      $log.info('Modal dismissed at: ' + new Date());
    });
  };
};

//Please note that $modalInstance represents a modal window (instance) dependency.
//It is not the same as the $modal service used above.

var ModalInstanceCtrl = function ($scope, $modalInstance, data) {
  $scope.modalData = {};
  $scope.modalData = data;

  $scope.ok = function () {
    $modalInstance.close($scope.modalData);
  };

  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };
};

OriginalL'auteur jbwilhite | 2014-11-03