如何在angularjs

Question

大家好我使用angularjs ngrepeat将数据绑定到table.i有一个添加新按钮当我点击bootstrap模型弹出打开我填写输入详细信息点击提交意味着数据将正确存储但表不能得到新数据，但一旦我重新加载页面数据将显示

我的控制器代码

var refresh = function () {
        $http.get('/ViewFacility').success(function (response) {
            $scope.ViewFacilitys = response;


    };

    refresh();

我添加新代码：

$scope.AddRole = function () {

        $http.post('/AddNewRole', $scope.Role).success(function (response) {

            refresh();
        });
    };

Html代码

  <form name="profileform">
            <div class="modal fade" id="myModal" role="dialog" ng-controller="IndexController">
                <div class="modal-dialog">

                    <!-- Modal content-->
                    <div class="modal-content" style="margin-top:135px">
                        <div class="modal-header">

                            <h4 class="modal-title ">Role Name</h4>
                        </div>
                        <div class="modal-body">

                            <h4>Name</h4>
                            <input type="text" name="RoleName" class="form-control" ng-model="Role.RoleName">
                            <span class="error" ng-show="profileform.FirstName.$invalid && profileform.FirstName.$dirty">Please enter a First Name</span>

                            <h4>Description</h4>
                            <input type="text" name="Description" class="form-control" ng-model="Role.Description">
                            <span class="error" ng-show="profileform.LastName.$invalid && profileform.LastName.$dirty">Please enter a Last Name</span>

                            <h4>IsActive</h4>
                            <input type="checkbox" name="IsActive" class="form-control checkbox" ng-model="Role.IsActive" style="margin-left:-47%" >
                            <span class="error" ng-show="profileform.Email.$invalid && profileform.Email.$dirty">Please enter a Email</span>
                        </div>
                        <div class="modal-footer">
                            <button class="btn btn-primary" ng-click="AddRole()" ng-disabled="profileform.$invalid">Submit</button>&nbsp;&nbsp;
                            <button class="btn btn-primary" data-dismiss="modal" ng-click="deselect()">Clear</button>&nbsp;&nbsp;&nbsp;&nbsp;
                        </div>
                    </div>
                </div>
            </div>
        </form>

Answer 1

只需将新项添加到数组中即可。

$scope.AddRole = function () {
    $http.post('/AddNewRole', $scope.Role).success(function (response) {
       $scope.ViewFacilitys.push($scope.Role);
    });
};

每次创建新项目时都不需要获取所有数据。必须只调用一次刷新。

对于分页，您可以编写一个简单的函数，将页数发送到服务器：

$scope.changePage = function (page) {
    $scope.get('/ViewFacility?page='+page)
       .then(function (response) {
          $scope.ViewFacilitys = response.data;
       });
}

Answer 2

尝试修改refresh功能

var refresh = function () {
        $http.get('/ViewFacility').success(function (response) { //assuming this only fetches the newly added one
            $scope.ViewFacilitys.push(response);
    };