Przycisk Bootstrap 3.0 na pasku nawigacyjnym

Zaktualizowałem teraz bootstrap 3.0. Znacznik „a”, który wygląda jak btn (przy pomocy klasy .btn) jest zniszczony na navbar.

<li>
   <a href="<?php echo BASE_PATH; ?>register.php" class="btn btn-primary btn-sm">
       <?php echo "<strong>" . _('Bayilik Başvurusu') . "</strong>"; ?>
   </a>
</li>

Ale to nie działa poprawnie. Myślę, że Bootstrap zmienił system.

Owiń <p class="navbar-btn">wokół <a class="btn">:

<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <ul class="nav navbar-nav">
            <li>
                <p class="navbar-btn">
                    <a href="#" class="btn btn-default">I'm a link button!</a>
                </p>
            </li>
        </ul>
    </div>
</nav>

JSFiddle: http://jsfiddle.net/lachlan/398kj/

Zrzut ekranu:

Teraz bootstrap 3 ma przyciski na pasku nawigacyjnym, takie jak ten:

<button type="button" class="btn btn-default navbar-btn">Sign in</button>

Używa, navbar-btnwięc wie, że jest na pasku nawigacyjnym.

Jeśli chcesz, żeby to działało, zrób to:

<li>
    <form action="#">
        <button class="btn btn-default navbar-btn">Link</button>
    </form>
</li>

W ten sposób nadal działa jak tag kotwicy. Po prostu zmień #wartość, do której faktycznie chcesz, aby osiągnęła.

W tym przypadku:

<li>
    <form action="<?php echo BASE_PATH; ?>register.php">
        <button class="btn btn-default navbar-btn">Link</button>
    </form>
</li>

W przypadku bootstrap 3 nadal możliwe jest <a>renderowanie łącza jako przycisku, ale musisz uwzględnić je w pliku <form>. Ponadto, <a>powinna zawierać navbar-btnklasę.

<li>
  <form>
    <a href="#" class="btn btn-primary btn-sm navbar-btn">
      register
    </a>
  </form>
</li>

Problem polega na tym, że selektor do stylizacji kotwicy w pasku nawigacyjnym to: .nav > li > aco oznacza, że ​​ma wyższy priorytet niż .navbar-btn.

Możesz to naprawić, po prostu zawijając go w inny tag, np. Rozpiętość. Myślę, że nie powinieneś używać tagu formularza, jak sugerują inni, ponieważ w ogóle nie jest to formularz.

http://learnangular2.com/events/

OBIEKT WYDARZENIA

Aby przechwycić obiekt zdarzenia, przekaż $ event jako parametr w wywołaniu zwrotnym zdarzenia z szablonu:

<button (click)="clicked($event)"></button>

Jest to łatwy sposób na zmodyfikowanie zdarzenia, na przykład wywołanie PreventDefault:

@Component(...)
class MyComponent {
  clicked(event) {
    event.preventDefault();
  }
}