À l'aide de l'interface utilisateur du routeur avec Bootstrap-ui modal

Je sais que cela a été couvert à de nombreuses reprises et la plupart des articles font référence à ce morceau de code: Fenêtre modale avec une URL personnalisée dans AngularJS

Mais je n'ai tout simplement pas l'obtenir. Je ne trouve pas ça très clair à tous. J'ai également trouvé ce jsfiddle qui était en fait un excellent, très utiles, sauf ce n'est pas ajouter l'url pour moi d'utiliser la touche retour pour fermer la modale.


Edit: c'est Ce que j'ai besoin d'aide.

Alors laissez-moi vous expliquer ce que je suis en train de réaliser. J'ai un formulaire pour ajouter un nouvel élément, et j'ai un lien "ajouter un nouvel article". Je voudrais que lorsque je clique sur "ajouter un nouvel élément" modale apparaît avec le formulaire, j'ai créé "add-item.html'. C'est un nouvel état, de sorte que l'url modifier /ajouter-élément.
Je peux remplir le formulaire, puis choisissez d'enregistrer ou de fermer. Fermer ferme la modale :p (comme c'est étrange) . Mais je peux aussi cliquer sur retour pour fermer la modale et retournez à la page précédente(de l'etat).

Je n'ai pas besoin d'aide avec Près à ce moment que je l'ai encore de la difficulté à réellement obtenir la modale de travail.


C'est mon code tel qu'il est:

Manette de Navigation: (est-ce vraiment le bon endroit pour mettre les fonctions modales?)

angular.module('cbuiRouterApp')
  .controller('NavbarCtrl', function ($scope, $location, Auth, $modal) {
    $scope.menu = [{
      'title': 'Home',
      'link': '/'
    }];

    $scope.open = function(){

        //open modal whithout changing url
        $modal.open({
          templateUrl: 'components/new-item/new-item.html'
        });

        //I need to open popup via $state.go or something like this
        $scope.close = function(result){
          $modal.close(result);
        };
      };

    $scope.isCollapsed = true;
    $scope.isLoggedIn = Auth.isLoggedIn;
    $scope.isAdmin = Auth.isAdmin;
    $scope.getCurrentUser = Auth.getCurrentUser;

    $scope.logout = function() {
      Auth.logout();
      $location.path('/login');
    };

    $scope.isActive = function(route) {
      return route === $location.path();
    };
  });

C'est la façon dont je suis l'activation du modal:

 <li ng-show='isLoggedIn()' ng-class='{active: isActive("/new-item")}'>
   <a href='javascript: void 0;' ng-click='open()'>New Item</a>
 </li>

new-item.html:

<div class="modal-header">
  <h3 class="modal-title">I'm a modal!</h3>
</div>
<div class="modal-body">
  <ul>
    <li ng-repeat="item in items"><a ng-click="selected.item = item">{{ item }}</a></li>
  </ul>Selected:<b>{{ selected.item }}</b>
</div>
<div class="modal-footer">
  <button ng-click="ok()" class="btn btn-primary">OK</button>
  <button ng-click="close()" class="btn btn-primary">OK</button>
</div>

Aussi, tant que ce n'ouvrez un modal ne se ferme pas et comme je ne pouvais pas travailler que.

  • Êtes-vous en mesure de fermer votre fenêtre modale lorsque vous cliquez sur fermer? Je suppose que non. droit?
  • Non, je n'arrive pas à la fermer. Je ne peux l'ouvrir et même alors, non seulement il n'est pas proche, mais il ne fonctionne pas avec l'état et le Changement d'url, pour que les liens ne fonctionnent pas.
  • J'ai fait un Débarquez avec ma dernière tentative pour résoudre cela, mais il"ne fonctionne pas. plnkr.co/modifier/k514Nc25zfr0amtnxXDu?p=preview
  • Je viens de voir votre plunker j'ai à dire, je n'ai pas obtenir quoi que ce soit de cela , ses totalement faux, Vous avez défini un contrôleur à l'intérieur de votre open-modale de la fonction Frère, c'est pour mieux vous expliquez votre problème réel tout d'abord,Croyez-moi , une bonne question, d'une valeur de 100 de mauvaises réponses
InformationsquelleAutor Daimz | 2014-07-12