我是 Angular 新手，我有一个菜单和一个容器，当用户单击菜单项时我希望 View 动态更改。我遵循了一些示例，但不起作用。这是我的代码，
1.Index.html 2.Dashboard.html
HTML:
<ul id="side-menu" class="nav">
<div class="clearfix"></div>
<li class="active" ng-click="template='dashboard.html'"><a href="">
<div class="icon-bg bg-orange"></div>
<span class="menu-title">Dashboards</span>
</a>
</li>
app.js:
var app = angular.module('Digin',[]);
这是 div:
<div class="page-content" ng-include src="template">
</div>
最佳答案
看起来你需要的是添加一个路由机制( View 通常是由路由定义的，而不是由逻辑条件定义的)Angular 让它变得干净的方法是通过路由模块，它可以使用 ngRoute 模块或使用 ui-router 来完成AngularUI 团队的模块。
这个想法是定义一个状态并将 View 附加到状态，在 html 中添加 ui-view 标签，并将 View 动态注入(inject)到其父包装器中:
app.js
var routerApp = angular.module('routerApp', ['ui.router']);
routerApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/dashboard');
$stateProvider
.state('dashboard', {
url: '/dashboard',
templateUrl: 'dashboard.html'
})
});
index.html(请将 ui-view 标签视为 html 容器)
<body ng-app="routerApp">
<!-- NAVIGATION -->
<nav class="navbar navbar-inverse" role="navigation">
<div class="navbar-header">
<a class="navbar-brand" ui-sref="#">AngularUI Router</a>
</div>
<ul class="nav navbar-nav">
<li><a ui-sref="dashboard">Dashboard</a></li>
</ul>
</nav>
<div class="container">
<div ui-view></div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.8/angular-ui-router.min.js"></script>
</body>
关于javascript - 如何使用 Angular 在菜单单击时在 div 中加载 html？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27468886/