Comment puis-je appeler un service à partir d'un modèle en AngularJS?

J'ai un service qui retourne un objet json qui la rend, pour des raisons de concision permet de dire qu'il ressemble à ceci:

.service ('levelService', function () {

    //service to manage levels.
    return  {
        levels : [{name:'Base', href:'base'},{name:'Level 1', href:'level1'},{name:'level2', href:'level2'}]
    };

})

Je pense que c'est très bien, mais je veux l'utiliser maintenant, dans un modèle. Actuellement, j'ai quelque chose comme ceci:

<ul class="dropdown-menu" ng-init="levels = [{name:'Base', href:'base'},{name:'Level 1', href:'level1'},{name:'level2', href:'level2'}];">
                      <li ng-repeat="level in levels">
      <a ng-href="#/modeling/level/{{level.href}}">{{level.name}}</a></li>
                  </ul>

Comment puis-je obtenir le ng-init maintenant utiliser le service? J'ai l'impression que la bonne chose à faire, c'est d'ajouter le service à la manette, mais c'est à l'extérieur de n'importe quel contrôleur. Dois-je créer un nouveau contrôleur pour cet espace, ou puis-je directement référence au service?

OriginalL'auteur nycynik | 2013-06-03

  1. 10

    Oui, il serait recommandé de créer un contrôleur.

    L'idée derrière le MVC, application architecture, c'est que vous n'avez pas hermétiquement couple de vos objets/classes ensemble. L'injection d'un service dans un contrôleur, puis par la suite de votre contrôleur en ajoutant levels à $scope signifie que votre code HTML n'a pas à s'inquiéter de savoir où il obtient les données d'.

    Également, à l'aide de ng-init de cette manière est sans doute l'amende pour frapper un très rapide de prototype, mais cette approche ne doit pas être utilisée dans le code de production (comme votre modèle de données elle-même est étroitement couplée à votre point de vue de l'HTML).

    Astuce: Il pourrait être une bonne idée d'utiliser un contrôleur pour le conteneur parent de votre dropdown-menu (ie. la page/section), puis utiliser une directive pour votre dropdown-menu lui-même. Pensez à une directive qu'une vue de composant.

    En général, vous pouvez trouver des tutoriels vidéo à tête d'oeuf.io utile.

    merci! Pris vos conseils, au lieu de faire une directive, juste un autre contrôleur.

    OriginalL'auteur Philip Bulley

  2. 3

    mis au service d'un contrôleur..
    Ensuite, vous pouvez appeler le service dans votre modèle..

    app.controller('yourCtrl', function($scope, levelService) {
   $scope.levelService= levelService;
});

    OriginalL'auteur SNT93