Как создать директиву angularjs, которая делает запрос ajax?

Я хотел бы добиться следующего результата:Как создать директиву angularjs, которая делает запрос ajax?

<users name="allUsers" get-all></users>

И затем, вынести выберите элемент со списком всех пользователей. Это то, что я сделал до сих пор:

var app = angular.module("Security", []); 

app.directive("users", function() { 
    return { 
     restrict: 'E' 
    }; 
}); 

app.directive("getAll", function() { 
    return { 
     restrict: 'A' 
    }; 
});

После многих поисковых запросов я ничего не нашел. Вероятно, я ищу крыс вместо собак ...

EDIT: ОК, теперь у меня есть служба, но до сих пор не знаю, как подключиться с помощью области.

app.factory('userService', function ($http) { 
    return { 
     getAll: function() { 
      return $http.get('/users/getAll') 
         .then(function (result) { 
          return result.data; 
          // [{Id: 1, Name: 'John'}, {Id: 2, Name: 'Mark'}] 
         }); 
     } 
    } 
}); 

app.directive("getAll", function() { 
    return { 
     restrict: 'A', 
     require: '^users', 
     template: '<option value="{{Id}}">{{Name}}</option>', 
     link: function (scope, element, attrs, userCtrl) { 
      userService.getAll() 
         .then(function (result) { 
          // What should I do? 
         }); 
     } 
    }; 
});

источник

2015-02-11 Jonathas Costa

хорошо, как правило, вы будете использовать сервис для отправки запроса Ajax, а затем сделать директиву зависят от него. однако я не уверен, насколько хорошо идея отправки запроса ajax в директиве будет связана с тем, сколько раз этот запрос будет отправлен во время цикла дайджеста. Неправильный инструмент для работы (что объясняет отсутствие результатов поиска). –

Благодарим вас за комментарий. То, что я действительно хочу достичь, - это простое повторное использование этого «компонента», потому что это используется очень часто. Любые другие идеи? –

Вы можете сделать это вид и дать представление своему собственному контроллеру/шаблону, который вы повторно используете для нескольких маршрутов. –

У меня есть.

var userModule = angular.module("Users", []); 

userModule.factory('userService', ['$http', function ($http) { 
    return { 
     getAll: function() { 
      return $http.get('/security/users/getAll') 
         .then(function (result) { 
          return result; 
         }); 
     } 
    } 
}]); 

userModule.directive("users", function() { 
    return { 
     restrict: 'E', 
     transclude: true, 
     template: '<select><option ng-repeat="item in collection" value="{{item.Id}}">{{item.Name}}</option></select>', 
     scope: true 
    }; 
}); 

userModule.directive("getAll", ['userService', function (service) { 
    return { 
     restrict: 'A', 
     scope: true, 
     link: function (scope) { 
      service.getAll() 
        .then(function (result) { 
         scope.collection = result.data; 
        }); 
     } 
    }; 
}]);

И вы можете использовать его как это:

<users get-all></users>

источник

2015-02-20 13:32:39

Как создать директиву angularjs, которая делает запрос ajax?

ответ

Смежные вопросы