AngularJS Reload 버튼?

Question

단추를 사용하여로드 된 데이터를 새로 고치는 방법을 추가하는 데 문제가 있습니다. 내 컨트롤러 :

.controller('mainCtrl', function($scope, $http, User) { 
     $scope.loading = true; 

     User.get() 
      .success(function(data) { 
       $scope.users = data; 
       $scope.loading = false; 
      }); 
    }); 

서비스 :

angular.module('userService', []) 

    .factory('User', function($http) { 

     return { 
      get : function() { 
       return $http.get('/api/users/get'); 
      } 
     } 

    }); 

그리고 이것은 내보기 같은 모습입니다 : 당신이 볼 수 있듯이

이

<div class="box" ng-app="userApp" ng-controller="mainCtrl"> 
       <div class="box-header"> 
        Angular Test <button class="btn btn-success" ng-click="get()"><i class="fa fa-refresh"></i> Reload</button> 
       </div> 
       <div class="box-body"> 
        <p class="text-center" ng-show="loading"><span class="fa fa-meh-o fa-5x fa-spin"></span></p> 
        <table ng-hide="loading" class="table table-responsive"> 
         <thead> 
          <tr> 
           <th>ID</th> 
           <th>Username</th> 
           <th>Realname</th> 
           <th>Email</th> 
           <th>Phone</th> 
           <th></th> 
          </tr> 
         </thead> 
         <tbody> 
          <tr ng-repeat="user in users"> 
           <td>@{{ user.id }}</td> 
           <td>@{{ user.name }}</td> 
           <td>@{{ user.realname }}</td> 
           <td>@{{ user.email }}</td> 
           <td>@{{ user.phone }}</td> 
           <td> 
            <a href="/admin/profile/@{{ user.id }}" class="btn btn-block btn-primary btn-sm"> 
             <i class="fa fa-user" aria-hidden="true"></i> Profile 
            </a> 
           </td> 
          </tr> 
         </tbody> 
        </table> 
       </div> 
      </div> 

, 나는 새로 고침 버튼을하려고하는 ng-click="get"을 사용 중입니다. 그러나 이것은 아무것도하지 않습니다. 거기에서 무엇을 부를까요?

Answer 1

컨트롤러에서 사용자 데이터를 가져 와서 범위에 할당하려면 컨트롤러에 새 함수를 만들어야합니다. 이렇게하면 원하는대로 템플릿에서 호출 할 수 있습니다.

.controller('mainCtrl', function($scope, $http, User) { 


    function get() { 
     $scope.loading = true; 
     User.get() 
      .success(function(data) { 
       $scope.users = data; 
       $scope.loading = false; 
      }); 
    } 

    // Assign the get function to the scope 
    $scope.get = get; 

    // Call the get function when the controller is created 
    get(); 
});