ngModelでモーダルテキストボックスが表示されない

Question

私はテレビ番組表を持つテーブルを持っています。私はdir-paginate/ng-repeatとテーブルを作成し、私はショーを編集できるようにモーダルを開くために行をクリックすることができますが、ngモデルのデータは、そのモーダル内のテキストボックスに読み込まれていません。

<tr id='schedule_row' class='hover_click_cell' dir-paginate='tv_show in tv_shows | orderBy:sortType:sortReverse | itemsPerPage:10'> 
<td class='center_text clickable_cell cell_width' ng-click='alter_show(tv_show)'>{{tv_show.show_name}}</td> 

クリックすると、それはデータをJSON形式でこのようなルックスを通過したalter_show()

$scope.alter_show = function(show) 
{ 
    $scope.edit_show = show; 
    var modalInstance = $uibModal.open ({ animation: $controller.animationsEnabled, 
               ariaLabelledBy: 'modal-title', 
               ariaDescribedBy: 'modal-body', 
               templateUrl: 'edit_tv_show.html', 
               controller: 'EditTvShowCtrl', 
               controllerAs: '$controller', 
               size: 'sm', 
               backdrop: 'static', 
               keyboard: false 
             }); 

    modalInstance.result.then(function (action) 
    { 

    }, 
    function() { 
    }); 
} 

関数を呼び出します。

{"watched":false,"id":1,"show_name":"The Walking Dead","season":1,"episode":1,"season_episode":"Season 1, Episode 1","$$hashKey":"object:4"} 

私はショーの詳細を渡し、それを設定します$scope.edit_showオブジェクトです。渡されるデータは空ではありませんが、モーダルが開かれると、テキストボックスにはデータが入力されません。これらは入力ボックスです。

$scope.edit_show = { 
    show_name: '', 
    season: 0, 
    episode: 0, 
    watched: 0 
}; 

<div class='form-group'> 
<label for='show_name'>Show Name:</label> 
<input type='text' class='form-control' id='edit_show_name' ng-model='edit_show.show_name'> 
</div> 

<div class='form-group'> 
<label for='season'>Season:</label> 
<input type='number' class='form-control' id='edit_season' ng-model='edit_show.season'> 
</div> 

クリックした行の詳細をテキストボックスに入力するにはどうすればよいですか？

Answer 1

私は、modalInstanceの解決を使用してそれを把握することができました。

$scope.alter_show = function(show) 
{ 
    var modalInstance = $uibModal.open ({ animation: $controller.animationsEnabled, 
               ariaLabelledBy: 'modal-title', 
               ariaDescribedBy: 'modal-body', 
               templateUrl: 'edit_tv_show.html', 
               controller: 'EditTvShowCtrl', 
               controllerAs: '$controller', 
               size: 'sm', 
               backdrop: 'static', 
               keyboard: false, 
               resolve: { tv_show : function() { return show; } } 
             }); 

    modalInstance.result.then(function (action) 
    { 

    }, 
    function() { 
    }); 
} 

angular.module('ui.bootstrap').controller('EditTvShowCtrl', function ($uibModalInstance, $scope, tv_show) 
{ 
    var $controller = this; 

    $scope.edit = tv_show; 
});