Hi. My question is quite simple, and what I found out so far didn't delight
me.
I have an Index.html that is the main page for logged users. Inside it
there is a menu and ng-view directive that handles the partials. That's
fine.
However, when the user Is not logged, I show the Home.html partial, but
this html is completely different from Index.html. It shouldn't be rendered
in the ng-view. It should be rendered like a normal page. The same applies
for the Login.html. It's completely different, that is, there are no nav
bar. The structure is different, and use ng-hide/show seems awkward.
What should I do?
*app.js*
var scoreApp = angular.module('scoreApp', ['ngRoute', 'angularMoment',
'UserApp', 'UserApp.facebook-picture', 'ui.bootstrap', 'underscore'])
.config(['$routeProvider', '$locationProvider', function
($routeProvider, $locationProvider) {
$routeProvider.when('/', { templateUrl: '/app/partials/Home.html',
public: true });
$routeProvider.when('/Votacao', { templateUrl:
'/app/partials/Voting.html', controller: 'VotingController' });
$routeProvider.when('/Login', { templateUrl:
'/app/partials/Login.html', login: true });
$routeProvider.otherwise({ redirectTo: '/' });
$locationProvider.html5Mode(true);
}])
*Index.html*
<!DOCTYPE html>
<html lang="pt-br" ng-app="scoreApp">
<head>
<meta charset="utf-8" />
<title>Awesome Score App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"
rel="stylesheet" />
<link
href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css"
rel="stylesheet" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300"
rel="stylesheet" />
<link href="app/css/bootstrap-social.css" rel="stylesheet" />
<link href="app/css/app.css" rel="stylesheet" />
</head>
<body>
<div class="container">
<nav class="navbar navbar-default navbar-fixed-top ng-cloak"
role="navigation" ng-cloak ng-controller="MenuController">
<div class="navbar-header">
<a class="navbar-brand" href="/">Score App</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav" ng-show="user.authenticated">
<li><a href="/Votacao">Votação <span class="badge"
ng-hide="scoresToVote == 0">{{scoresToVote}}</span></a></li>
</ul>
<ul class="nav pull-right" style="margin-right:10px;"
ng-show="user.authenticated">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown"
href="#">
<img class="nav-user-photo" ua-facebook-picture
/>
<span class="user-info">
{{user.first_name}}
</span>
<i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu">
<li><a href="#" ua-logout><i class="fa
fa-power-off"></i>Logout</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<ng-view></ng-view>
</div>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
