代码:
<head>
<script>
function getLink(link){
var href = link.getAttribute("data-link");
if(href == 'urlA'){
$('#displayContent').attr('ng-include',"'abc/urlA.html'");
}
if(href == 'urlB'){
$('#displayContent').attr('ng-include',"'abc/urlB.html'");
}
if(href == 'urlC'){
$('#displayContent').attr('ng-include', "'abc/urlC.html'");
}
}
</script>
</head>
<body ng-controller="myController">
<ul>
<li data-link="urlA" onclick="getLink(this)">Include Url A</li>
<li data-link="urlB" onclick="getLink(this)">Include Url B</li>
<li data-link="urlC" onclick="getLink(this)">Include Url C</li>
</ul>
<div id="displayContent"></div>
</body>
div将成为<div id="displayContent" ng-include="'abc/urlA.html'></div>
当我点击第一个列表项时,但该页面没有包含&#34; urlA.html&#34;。
谁能告诉我这个错误?
顺便说一下,当我写的时候,页面包含了另一页
<div id="testing" ng-include="'abc/urlA'"></div>
答案 0 :(得分:0)
尝试将“'abc / urlA.html'”更改为“abc / urlA.html”,在脚本标记内的B和C中相同
答案 1 :(得分:0)
在&#34; onclick&#34;回调你不在&#34; Angular Context&#34;。
你可以:
从&#34; onclick&#34;到&#34; ng-click&#34;
<li data-link="urlA" ng-click="getLink(this)">Include Url A</li>
使用$ scope。$ apply()
手动应用角度上下文function getLink(link){
$scope.$apply(function () {
var href = link.getAttribute("data-link");
if(href == 'urlA'){
$('#displayContent').attr('ng-include',"'abc/urlA.html'");
}
if(href == 'urlB'){
$('#displayContent').attr('ng-include',"'abc/urlB.html'");
}
if(href == 'urlC'){
$('#displayContent').attr('ng-include', "'abc/urlC.html'");
}
});
}
当然你需要一个Controller来操作$ scope。