Question

我为该页面上的基页和模态定义了一个单独的控制器，其中包含一个包含本地存储的值的表单。问题是这个模态控制器在页面加载到DOM时加载模态元素的值，并在每次弹出时显示该值。但它需要在每次弹出时从本地存储加载值，因为它需要具有单独的值。

HTML：

<div ng-controller="resourceListController">
<table>
    <tbody>
                <tr ng-repeat="resource in filteredList|orderBy:orderProperty:reverse" ng-click="showDetails(resource)" data-toggle="modal" data-target="#resourceDetailModal">
                        <td> {{resource.ResourceName}}</td>
                        <td> {{resource.Age}}</td>
                    </tr>
            </tbody>
</table>
<div>



<!-- Resource Detail Modal-->
<div class="modal fade" id="resourceDetailModal" tabindex="-1" ng-cloak ng-controller="resourceDetailController">
<div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title">Modal title</h4>
        </div>
        <div class="modal-body">
            <form class="form-horizontal">
                <div class="form-group">
                    <label class="control-label col-xs-4">Resource Name</label>
                    <div class="col-xs-8"><label class="form-control">{{resource.ResourceName}}</label></div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4">Age</label>
                    <div class="col-xs-8"><label class="form-control">{{resource.Age}}</label></div>
                </div>
            </form>
        </div>
    </div>
</div>

角度脚本： resourceListController：

 $scope.showDetails = function(resource) {
    localStorage.setItem("res", JSON.stringify(resource));
};

resourceDetailController：

resourceApp.controller('resourceDetailController', function($scope) {
   $scope.resource = JSON.parse(localStorage.getItem("res"));
});

Answer 1

您可以在resourceDetailController中添加以下代码，以便在弹出时更新模态数据。编辑：

 $scope.showDetails = function(resource) {
localStorage.setItem("res", JSON.stringify(resource));
    $("#resourceDetailModal").modal();
};
$scope.data={};
$scope.data.filteredList=[{ResourceName:"AkankshaGupta ",Age:93},
{ResourceName:"Asha",Age:91}];
});
resourceApp.controller('resourceDetailController', function($scope) {
$( "#resourceDetailModal" ).on('show.bs.modal', function(){
$scope.resource = JSON.parse(localStorage.getItem("res"));
});
});

请检查此代码，这是工作。我删除data-target而不是手动显示模式

HTML：<tr ng-repeat="resource in data.filteredList" ng-click="showDetails(resource)"></tr>

我希望这会有所帮助

每次打开时，为角度控制器重新加载角度控制器

1 个答案: