Daten aus einer Teilansicht in AngularJS Bindung

Question

ich ein Datum aus Teilansicht zu indizieren binden möge es in derselben Ansicht zu binden, jedoch nicht andere view.I versuchten, wie diese

$scope.GetDelete = function (cy_name) { 
 
     $scope.items = cy_name; 
 
     //$scope.newItem = { title: '' }; 
 
     alert($scope.items); 
 

 
    }

<button type="button" class="btn btn-xs btn-danger margin-inline" data-toggle="modal" data-target="#dvDelete" ng-click="GetDelete('@item.cy_name')"><i class="fa fa-trash"></i></button>

   <div class="modal fade" id="dvDelete" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true"> 
 
        <div class="modal-dialog" role="document"> 
 
         <div class="modal-content"> 
 
          <div class="modal-header"> 
 
           <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
            <span aria-hidden="true">&times;</span> 
 
           </button> 
 
           <h4 class="modal-title" id="myModalLabel">Are you sure?</h4> 
 
          </div> 
 
          <div class="modal-body"> 
 
           <p>{{items}}</p> 
 
          </div> 
 
          <div class="modal-footer"> 
 
           <button type="button" class="btn" data-dismiss="modal">Cancel</button> 
 
           <button type="button" class="btn btn-danger"ng-click="GetDelete('Test')">Delete</button> 
 
          </div> 
 
         </div> 
 
        </div> 
 
       </div>   

Modal zeigt aber Daten nichts

Answer 1

Damit die Bereichsvariable in Ihrem Modal verfügbar ist, muss der modale Code in den Bereich des Controllers fallen. Wenn es außerhalb des Gültigkeitsbereichs definiert ist, würde die modale Vorlage das Vorhandensein des Gültigkeitsbereichs nicht kennen.

angular.module('myapp', []) 
 
    .controller('myctrl', function($scope) { 
 

 

 
    $scope.GetDelete = function(cy_name) { 
 
     $scope.items = cy_name; 
 
     //$scope.newItem = { title: '' }; 
 
     alert($scope.items); 
 
    } 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
<div ng-app='myapp' ng-controller='myctrl' class="modal fade" id="dvDelete" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true"> 
 
    <div class="modal-dialog" role="document"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
      <span aria-hidden="true">&times;</span> 
 
     </button> 
 
     <h4 class="modal-title" id="myModalLabel">Are you sure?</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
     <p>{{items}}</p> 
 
     </div> 
 
     <div class="modal-footer"> 
 
     <button type="button" class="btn" data-dismiss="modal">Cancel</button> 
 
     <button type="button" class="btn btn-danger" ng-click="GetDelete('Test')">Delete</button> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
<button type="button" class="btn btn-xs btn-danger margin-inline" data-toggle="modal" data-target="#dvDelete" ng-click="GetDelete('@item.cy_name')"><i class="fa fa-trash"></i> 
 
</button>

Hier ist ein funktionierendes

Snippet