github/JavaScriptServices
1
1
Fork 0
mirror of https://github.com/aspnet/JavaScriptServices.git synced 2025-12-25 11:07:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make templates work with nonempty baseUrls (e.g., IIS virtual directories)

Browse Source
This commit is contained in:
Steve Sanderson
2017-07-11 23:45:25 +01:00
parent bb0727c34c
commit e65ecebac6
31 changed files with 65 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
templates/KnockoutSpa/ClientApp/components/nav-menu/nav-menu.html
View File

@@ -13,17 +13,17 @@
<div class='navbar-collapse collapse'>
<ul class='nav navbar-nav'>
<li>
<a href='/' data-bind='css: { active: route().page === "home-page" }'>
<a data-bind='attr: { href: router.link("/") }, css: { active: route().page === "home-page" }'>
<span class='glyphicon glyphicon-home'></span> Home
</a>
</li>
<li>
<a href='/counter' data-bind='css: { active: route().page === "counter-example" }'>
<a data-bind='attr: { href: router.link("/counter") }, css: { active: route().page === "counter-example" }'>
<span class='glyphicon glyphicon-education'></span> Counter
</a>
</li>
<li>
<a href='/fetch-data' data-bind='css: { active: route().page === "fetch-data" }'>
<a data-bind='attr: { href: router.link("/fetch-data") }, css: { active: route().page === "fetch-data" }'>
<span class='glyphicon glyphicon-th-list'></span> Fetch data
</a>
</li>

8
templates/KnockoutSpa/ClientApp/components/nav-menu/nav-menu.ts
View File

@@ -1,18 +1,20 @@
import * as ko from 'knockout';
import { Route } from '../../router';
import { Route, Router } from '../../router';
interface NavMenuParams {
route: KnockoutObservable<Route>;
router: Router;
}
class NavMenuViewModel {
public router: Router;
public route: KnockoutObservable<Route>;
constructor(params: NavMenuParams) {
// This viewmodel doesn't do anything except pass through the 'route' parameter to the view.
// You could remove this viewmodel entirely, and define 'nav-menu' as a template-only component.
// But in most apps, you'll want some viewmodel logic to determine what navigation options appear.
this.route = params.route;
this.router = params.router;
this.route = this.router.currentRoute;
}
}