thinkphp5.0 html页面中 a标签 中href 链接 有变量 报错，各位大神 应该怎么解决？

[lihe5140]

最近在写一个个人网站，在导航高亮这里，功能实现了，但是href跳转地址怎么写都报错，求大神分析分析原因！
下边是代码：

后台代码：
class Common extends Controller
{
public function _initialize()
{
$nav=Db('nav')->order('navcat asc')->select();
// print_r($nav);
$request = Request::instance();
foreach($nav as $key=>$val){
$nav[$key]['controller']=strtolower($request->controller());
}
$this->assign('nav',$nav);
}
}
打印出来的数组：
Array
(
[0] => Array
(
[id] => 14
[navname] => 111
[navcat] => 1
[navcontroller] => index
[controller] => index
)

[1] => Array
(
[id] => 8
[navname] => 222
[navcat] => 2
[navcontroller] => article
[controller] => index
)

[2] => Array
(
[id] => 9
[navname] => 333
[navcat] => 3
[navcontroller] => novel
[controller] => index
)

[3] => Array
(
[id] => 10
[navname] => 444
[navcat] => 4
[navcontroller] => music
[controller] => index
)

[4] => Array
(
[id] => 11
[navname] => 555
[navcat] => 5
[navcontroller] => movie
[controller] => index
)

[5] => Array
(
[id] => 12
[navname] => 666
[navcat] => 6
[navcontroller] => message
[controller] => index
)

)

html页面的代码

<div class="list">
<ul>
{volist name='nav' id='nav_val'}
<a {if condition="$nav_val['controller'] == $nav_val['navcontroller']" } class="active" {/if} href="#"><li>{$nav_val.navname}</li></a>
{/volist}
</ul>
</div>

在html页面中，href的跳转 怎么写？
我最开始写的 href="{:url('$nav_val['navcontroller']/index')}" 运行报错！
拼接方法 href=“{:url(' '+$nav_val['navcontroller']+'/index')}” 还是报错！
希望大神帮忙分析一下
js方法，因为是一个循环，就必须给每个a标签加上id或者class，最后还是因为拼接字符串 ，从晚上七点 卡到现在 实在是头疼。
下面是Jquery 方法的html页面，希望指正
<div class="list">
<ul>
{volist name='nav' id='nav_val'}
<script>
var aid={$nav_val['id']};
var nav="{:url('{$nav_val['navcontroller']}/index')";
$("#nav{$nav_val['id']}").attr('href',nav);
</script>
<a id="nav{$nav_val['id']}" {if condition="$nav_val['controller'] == $nav_val['navcontroller']" } class="active" {/if} href="#"><li>{$nav_val.navname}</li></a>
{/volist}
</ul>
</div>

[tottyandbaty]

你这Html代码里面写逻辑，看的蛋疼。。。。 a标签的id,class ,你就不能在模板赋值之前拼装好？这样写起来岂不是更容易？

[tottyandbaty]

另外，模板的渲染最终在服务端完成，按照你的代码逻辑，

<div class="list">
                <ul>
                	{volist name='nav' id='nav_val'}
                	<script>
                	var aid={$nav_val['id']};
                	var nav="{:url('{$nav_val['navcontroller']}/index')";
                	$("#nav{$nav_val['id']}").attr('href',nav);
                	</script>
                 <a id="nav{$nav_val['id']}" {if condition="$nav_val['controller'] == $nav_val['navcontroller']" } class="active" {/if}  href="#"><li>{$nav_val.navname}</li></a>
                	{/volist}
                </ul>
            </div>

你先生成了$("#nav{$nav_val['id']}").attr('href',nav); 这个，页面在浏览器执行，但是你的<a id="nav{$nav_val['id']}" 这个在后面，这个元素在前面执行时，并没生成。javascript脚本自然会报错。 所以a标签的链接，class,id 宁愿在模板赋值之前都拼装好，这样模板便于日后维护