As a Java/Python developer, I found myself working on an AngularJS project recently.
While most concepts were easy to grasp, some of the syntax and functionality still elude me.
The code I have handles login/logout functionality. If the user is logged in, it should show X. I am looking to make the template conditional.
if loggedIn
show this
else
show this
I understand that I need to use the template variable to set the generated HTML for the page. How can I achieve this?
This is the code snippet I aim to modify.
.directive('login', ['loginService', function(loginService) {
return {
restrict: "E",
replace: true,
template: '<div ng-show="session.loggedIn" class="loginwidget">Logged In: {{ session.username }} <button ng-click="session.logOut()">Log Out</button> </div>',
//scope: { user: '=' },
link: function(scope,element,attrs) {
scope.session = loginService.session();
}
};
}])
;
The project uses AngularJS v1.0.8. I plan to upgrade it soon as the ng-if directive was introduced later which I believe will help solve some problems. Additionally, ensuring an up-to-date version of the AngularJS library is important to me.