以下jade模板在弹出窗口中显示登录表单(loginForm)。相反,在路径中呈现为视图的一部分时,相同的表单标记可以正常工作,但是当按照下面的编码放入弹出窗口时,ng-submit不起作用。提交表格会在当前位置提交GET提交。
doctype html
html(lang='en', data-ng-app='angular-client-side-auth')
head
meta(charset='utf-8')
title Whatever
//- CSS
link(rel='stylesheet', href='/css/app.css')
link(href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css", rel="stylesheet")
link(href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css", rel="stylesheet")
//- This is needed because Facebook login redirects add #_=_ at the end of the URL
script(type="text/javascript").
if (window.location.href.indexOf('#_=_') > 0) {
window.location = window.location.href.replace(/#.*/, '');
}
body(data-ng-cloak)
.container
.container.navbar.navbar-inverse.navbar-fixed-top(data-ng-controller="NavCtrl")
ul.navbar-nav.nav(data-access-level='accessLevels.anon', active-nav)
li: a.navbar-brand(href="/") Whatever
ul.navbar-nav.nav.pull-right(data-access-level='accessLevels.anon', active-nav)
li: a(href="#" id="loginLink") Log In
ul.navbar-nav.nav(data-access-level='accessLevels.user', active-nav)
li: a.navbar-brand(href="/home") Quiver
ul.navbar-nav.nav.pull-right(data-access-level='accessLevels.user', active-nav)
li.dropdown
a.dropdown-toggle(href="#", data-toggle="dropdown")
|{{user.username}} <b class="caret"></b>
ul.dropdown-menu
li: a(href="/u/{{user.username}}") Your Profile
li: a(data-ng-click="logout()") Log Out
.alert.alert-danger(id='error', data-ng-bind="error", data-ng-show="error")
div.content(id='content', data-ng-view='ng-view')
#login.hide
form.form-horizontal(ng-controller="LoginCtrl", ng-submit="login()", id="loginForm", name="loginForm", role="form", autocomplete="off")
input(type="hidden", data-ng-model="foo", value="bar")
.form-group
input.form-control(type="text", data-ng-model="username", placeholder="Username", name="username", required, autofocus)
.form-group
input.form-control(type="password", data-ng-model="password", placeholder="Password", name="password", required)
.form-group
input(type="checkbox", data-ng-model="rememberme", name="rememberme")
| Remember me
.form-group
button.btn.btn-default(type="submit") Log in
//- JavaScript
script(src='//code.jquery.com/jquery-1.10.1.min.js')
script(src='//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js')
script(src='//ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js')
script(src='//ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-cookies.min.js')
script(src='//ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-route.min.js')
script(src='//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js')
script(src='/js/routingConfig.js')
script(src='/js/app.js')
script(src='/js/services.js')
script(src='/js/controllers.js')
script(src='/js/filters.js')
script(src='/js/directives.js')
script(type="text/javascript").
$(document).ready(function() {
$('#loginLink').popover({
placement:'bottom',
template: '<div class="popover" style="margin-left:-70px; margin-top:-5px;"><div class="arrow" style="margin-left:60px"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
html : true,
content: function() {
return $('#login').html();
}
});
});
//- Partial views... Load up front to make transitions smoother
script(type="text/ng-template", id="404")
include partials/404
script(type="text/ng-template", id="index")
include partials/index
script(type="text/ng-template", id="login")
include partials/login
我假设表格超出了范围。可以做些什么?