Angularjs路由选择不与基地工作的href [英] Angularjs routing not working with base href
问题描述
作为示例程序,我下载这plunker 从教程在不同页面的测试标签路由。我下载了完整的zip就跑,因为它是(例如,文件同一目录下,并且链接是CDN 的),但没有奏效。我觉得角文件不包含,因为它是显示输出:
点击下面的选择之一。
设置页1 LT; BR />
选项卡{{}路径} //应该模型变量
但它在plunker工作正常。用碱HREF路径或版本的问题?我试着包括我自己的文件angular.min.js,而不是链接,但它仍然无法正常工作。
这里的HTML:
< HEAD>
<间的charset =UTF-8/>
<标题> AngularJS Plunker< /标题>
<脚本>
文件撰写('<基本href =+ document.location +'/>');
< / SCRIPT>
<链接HREF =style.css文件的rel =stylesheet属性/>
&所述;脚本数据semver =1.2.7SRC =HTTP://$c$c.angularjs.org/1.2.7/angular.js数据需要=angular.js@1.2.x&GT ;< / SCRIPT>
&所述; SCRIPT SRC =HTTP://$c$c.angularjs.org/1.2.7/angular-route.js>&下; /脚本>
&所述; SCRIPT SRC =app.js>&下; /脚本>
< /头><机身NG-应用=plunker>
< DIV NG控制器=NavCtrl>
< P>点击以下选项之一< / P>
< UL>
<李纳克级={活跃:isActive('/ TAB1')}>< A HREF =#/ TAB1>标签1 LT; / A>
< /李>
<李纳克级={活跃:isActive('/ TAB2')}>< A HREF =#/ TAB2>标签2'; / A>
< /李>
< / UL>
< pre> {{路径}}< / pre>
< / DIV>
< DIV NG-视图>< / DIV>
< /身体GT;< / HTML>
尝试 NG-HREF =tab1的
而不是 HREF = #/ TAB1
as a sample program, I downloaded this plunker from a tutorial to test tab routing in different pages. I downloaded the complete zip and ran as it is (e.g. files in same directory, and links are CDN) but it didn't work. I think the angular file is not included as it was showing this output:
Click one of the following choices.
tab 1<br/>
tab 2
{{ path }} //supposed to model the variable
But it works fine in the plunker. Is the problem with base href path or version? I tried including my own files for angular.min.js instead of the link but it still doesn't work.
Here's the html:
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<link href="style.css" rel="stylesheet" />
<script data-semver="1.2.7" src="http://code.angularjs.org/1.2.7/angular.js" data-require="angular.js@1.2.x"></script>
<script src="http://code.angularjs.org/1.2.7/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="plunker">
<div ng-controller="NavCtrl">
<p>Click one of the following choices.</p>
<ul>
<li ng-class="{active: isActive('/tab1')}"><a href="#/tab1">tab 1</a>
</li>
<li ng-class="{active: isActive('/tab2')}"><a href="#/tab2">tab 2</a>
</li>
</ul>
<pre>{{ path }}</pre>
</div>
<div ng-view></div>
</body>
</html>
try with ng-href="tab1"
instead of href="#/tab1"
这篇关于Angularjs路由选择不与基地工作的href的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!