在angularjs中使用引導模式時沒有數據綁定

Question

我正在使用mongodb，express，angularjs和nodejs來開發一個簡單的應用程序。不過，我面臨的問題是，當我使用引導模式編輯記錄時，數據不會與ng-repeat中的數據綁定。

下面是我的代碼

entryController.js

function entryController($scope, $modal, entryFactory) { 


// Get All Entry 
entryFactory.getEntries().success(function(data) { 
    $scope.entries = data; 
}); 


// View Entry Detail 
$scope.editEntry = function(id){ 
    var id = id._id; 

    var modalInstance = $modal.open({ 
    templateUrl: 'editEntryModal', 
    controller: editEntryModalController, 
    resolve: { 
     entry: function(){ 
      return entryFactory.getEntry(id); 
     } 
    } 
    }); 
}; 

}; 

var editEntryModalController = function($scope, $modalInstance, $window, data, entryFactory) { 
$scope.entry = {}; 


$scope.entry = data.data.entry; 
$scope.entry.name = data.data.entry.name; 


$scope.editEntry = function(){ 
    entryFactory.updateEntry(data.data.entry._id, $scope.entry).success(function(){ 

     $modalInstance.close(); 
    }); 
}; 

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

下面這是我的HTML代碼（entry.html）

<div class="container-fluid"> 
    <div class="row"> 

    <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main"> 


     <button type="button" class="btn btn-default btn-lg" ng-click="addEntry()"><span class="glyphicon glyphicon-plus"></span></button> 


     <div class="col-sm- col-xs-12 col-lg-3"> 
     <form class="form-search"> 
       <div class="input-group"> 
        <input type="text" class="form-control " placeholder="Search..." ng-model="query"> 
        <span class="input-group-btn"> 
         <button type="submit" class="btn btn-search">Search</button> 
        </span> 
       </div> 
      </form> 
     </div> 

     <br /> 
     <br /> 

     <div class="panel panel-default"> 
      <div class="panel-heading"> 
       <h4>List Entry</h4> 
      </div> 

      <table class="table table-striped"> 
       <thead> 
        <tr> 
         <th>#</th> 
         <th>Name</th> 
         <th>Email</th> 
         <th>Country</th> 
         <th>Comment</th> 
         <th></th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr ng-repeat="entry in entries | filter: query"> 
         <td>{{$index+1}}</td> 
         <td>{{entry.name}}</td> 
         <td>{{entry.email}}</td> 
         <td>{{entry.country}}</td> 
         <td>{{entry.comment}}</td> 
         <td> 
          <button type="button" class="btn btn-default btn-lg" ng-click="viewEntry(entry)"><span class="glyphicon glyphicon-eye-open"></span></button> 
          <button type="button" class="btn btn-default btn-lg" ng-click="editEntry(entry)"><span class="glyphicon glyphicon-edit"></span></button> 
          <button type="button" class="btn btn-default btn-lg" ng-click="deleteEntry(entry)"><span class="glyphicon glyphicon-trash"></span></button> 
         </td> 
        </tr> 
       </tbody> 
      </table> 

     </div> 

    </div> 

    </div> 
</div> 


<!-- Edit Entry Modal --> 
<script type="text/ng-template" id="editEntryModal" /> 
<div modal="entryEdit"> 
<div class="modal-header"> 
    <h3>Edit - {{ entry.name }}</h3> 
</div> 
<div class="modal-body"> 
    <form role="form" class="form-horizontal" ng-model="addForm"> 
    <div class="form-group"> 
    <label for="inputName" class="col-sm-2 control-label">Name</label> 
    <div class="col-sm-6"> 
     <input type="text" class="form-control" id="inputName" ng-model="entry.name" name="name" placeholder="Name"> 
    </div> 
    </div> 
    <div class="form-group"> 
    <label class="control-label col-sm-2" for="inputEmail">E-mail</label> 
    <div class="col-sm-6"> 
     <input type="text" class="form-control" id="inputEmail" ng-model="entry.email" name="email" placeholder="E-mail"> 
    </div> 
    </div> 
    <div class="form-group"> 
    <label class="control-label col-sm-2" for="inputCountry">Country</label> 
    <div class="col-sm-6"> 
     <input type="text" class="form-control" id="inputCountry" ng-model="entry.country" name="country" placeholder="Country"> 
    </div> 
    </div> 
    <div class="form-group"> 
    <label class="control-label col-sm-2" for="inputComment">Comment</label> 
    <div class="col-sm-6"> 
     <input type="text" class="form-control" id="inputComment" ng-model="entry.comment" name="comment" placeholder="Your Comment"> 
    </div> 
    </div> 
    </form> 
    </div> 
    <div class="modal-footer"> 
    <button ng-click="editEntry()" class="btn btn-info"><i class="icon-plus icon-white"></i>Save</button> 
    <button class="btn btn-warning cancel" ng-click="cancel()">Cancel</button> 
    </div> 
    </div> 
</div> 
</script> 

下面是問題的打印屏幕。

http://imageshack.com/a/img534/3024/h5cy.png

Answer 1

當你做

return entryFactory.getEntry(id);

並結合模態您檢索不同的對象。

而你的列表是綁定到具有不同的參考集合

entryFactory.getEntries().success(function(data) { 
    $scope.entries = data; 
}) 

這裏的選項時，更新是通過調用getEntries後$modalInstance.close();

第二完成重新獲取實體是獲取對象更新並將其添加到替換舊版本的集合中。