我正在尝试在AngularJs中动态显示链接。
我的小提琴在这里:http://jsfiddle.net/ADukg/10228/
由于某些原因,标记不会填充标记中的值,但值是来自控制器的属性。
标记
<div class="collapse navbar-collapse" uib-collapse="navCollapsed">
<div class="collapse navbar-collapse" uib-collapse="navCollapsed">
<ul class="nav navbar-nav navbar-right">
<li ng-repeat="leftLink in leftLinks">
<a href="#!{{leftLink.Url}}">{{leftLink.Text}}</a>
<li uib-dropdown ng-if="leftLink.subMenus">
<a href="#" uib-dropdown-toggle>Hello
<b class="caret"></b>
</a>
<ul class="dropdown-menu" role="menu">
<li ng-repeat="subMenu in leftLink.subMenus">
<a href="#!{{subMenu.Url}}">{{subMenu.Text}}</a>
<li role="separator" class="divider"></li>
</li>
</ul>
</li>
</li>
</ul>
</div>
</div>
Angular Js
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.leftLinks = [
{
subMenus: [
{
Text: "Profile",
Url: "/profile"
},
{
Text: "Change Password",
Url: "/change-password"
},
{
Text: "Logout",
Url: "#"
}
]
}
];
}
答案 0 :(得分:2)
代码中存在一些错误。请参阅jsfiddle:http://jsfiddle.net/ADukg/10232/
它没有调用控制器,因此,我更改为.controller("Myctrl",function ($scope)
并在第一个元素的html ng-controller="Myctrl"
上实例化它。另一个错误是变量名称为leftLink
而不是leftLinks
。
您必须检查自己的HTML代码,因为您无法将li
直接放在另一个li
内,但这不会导致错误。
var myApp = angular.module('myApp',[])
.controller("Myctrl",function ($scope) {
$scope.leftLinks =
{
subMenus: [
{
Text: "Profile",
Url: "/profile"
},
{
Text: "Change Password",
Url: "/change-password"
},
{
Text: "Logout",
Url: "#"
}
]
};
});