Question

我想使用AngularJs刷新html表。事实上，这是我的代码主页代码

<body ng-app="myApp">

    <div class="generic-container" ng-controller="UserController as ctrl">
 <div  id="createUserContent.jsp"  ng-include="createUserContent"></div>
 <div  id="editUserContent.jsp"  ng-include="editUserContent"></div>
  <div  id="deleteUserContent.jsp"  ng-include="deleteUserContent"></div>

        <table>
            <tr>
                <td><button type="button" class="btn btn-primary"
                        ng-click="ctrl.openCreateUser()">Create</button></td>

            </tr>
        </table>




        <table class="table table-hover">
            <thead>
                <tr>
                    <th>ID.</th>
                    <th>Name</th>
                    <th>Address</th>
                    <th>Email</th>
                    <th width="20%"></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="u in ctrl.users">
                    <td><span ng-bind="u.ssoId"></span></td>
                    <td><span ng-bind="u.firstName"></span></td>
                    <td><span ng-bind="u.lastName"></span></td>
                    <td><span ng-bind="u.email"></span></td>
                    <td>
                        <button type="button" ng-click="ctrl.openEditUser(u)"
                            class="btn btn-success custom-width">Edit</button>
                        <button type="button" ng-click="ctrl.openDeleteUser(u)"
                            class="btn btn-danger custom-width">Remove</button>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

</body>

现在我有了

的createUserContent

<form role="form" ng-controller="UserController as ctrl" >
    <div class="form-group">
        <label for="FirstName">FirstName</label> <input type="FirstName"
            ng-model="ctrl.user.firstName" class="form-control"
            id="FirstName" placeholder="Enter FirstName" /> <label
            for="lastName">lastName</label> <input type="lastName"
            class="form-control" id="lastName"
            ng-model="ctrl.user.lastName" placeholder="Enter lastName" />
        <label for="email">Email address</label> <input type="email"
            ng-model="ctrl.user.email" class="form-control" id="email"
            placeholder="Enter email" />
    </div>
    <div class="form-group">
        <label for="homeAddressLocation">Home Address</label> <input class="form-control"
            ng-model="ctrl.user.homeAddress.location" id="homeAddressLocation"
            placeholder="homeAddressLocation" />
    </div>
    <div class="form-group">
        <label for="SSOId">SSOId</label> <input class="form-control"
            ng-model="ctrl.user.ssoId" id="SSOId" placeholder="SSOId" />
    </div>
    <button type="submit" class="btn btn-default"
        ng-click="ctrl.saveUser(ctrl.user)">Save</button>
    <button type="submit" class="btn btn-default">Cancel</button>
</form>

现在，当我完成保存用户后，我希望我的桌子能够自动刷新，但我不知道该怎么做。我试过$ apply但是徒劳这是我的角度js代码：

App.controller('UserController', function($scope, UserService, $window,$log,$uibModalStack, $rootScope,
        $uibModal) {
    var self = this;
    self.user = {
        id : null,
        username : '',
        address : '',
        email : ''
    };
    self.users = [];

    self.fetchAllUsers = function() {
        UserService.fetchAllUsers().then(function(d) {
            self.users = d;
            if(!$scope.$$phase) {
    $scope.$apply();
}

        }, function(errResponse) {
            window.alert(errResponse);
            console.error('Error while fetching Currencies');
        });
    };
    self.saveUser = function(user) {
        UserService.createUser(user);
        $log.log("saving user");
        $uibModalStack.dismissAll();


          $rootScope.$on('saveUserWithSuccess', function (event, data) {

    self.fetchAllUsers();
    if(!$scope.$$phase) {
    $scope.$apply();
}

Answer 1

您不需要执行$scope.$apply，您已经正确地执行了此操作:)只需确保您的UserService向用户返回actuall数组，而不是包含{{1}的对象}。

你的data.users[]是否会回复承诺？在这种情况下，我会UserService.createUser()而不是使用UserService.createUser().then(function(){ self.fetchAllUsers(); \);。

此外，您不应在控制器中注入$rootScope.$on('saveUserWithSuccess'。仅在控制器中使用$rootScope，在服务中使用$scope.$on。

如何使用AngularJS刷新HTML表？

1 个答案: