在 Angular js 中嵌套 ng-views

本文介绍了在 Angular js 中嵌套 ng-views的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有两个不同的 angular 应用.在集成到单个应用程序期间，我不得不

嵌套 ng-views.

对于示例 (index.html) 是

<html lang="en" ng-app="myApp"><头><meta charset="utf-8"><title>我的 AngularJS 应用</title><link rel="stylesheet" href="css/app.css"/><身体><ul class="菜单"><li><a href="#/view1">view1</a></li><li><a href="#/view2">view2</a></li><div ng-view></div><div>Angular 种子应用程序:v<span app-version></span></div><script src="lib/angular/angular.js"></script><script src="js/app.js"></script><script src="js/services.js"></script><script src="js/controllers.js"></script><script src="js/filters.js"></script><script src="js/directives.js"></script></html>

我的应用视图之一是 (view2.html)


<p>这是视图 1 的部分.</p>{{ '当前版本是 v%VERSION%.'|插值}}

现在这个应用程序内部再次有不同的视图.

我试过了，但页面没有加载.是否有可能嵌套 ng-views?

如果不可能，能否解释一下

提前致谢

解决方案

更新答案:

UI 路由器(现在位于此处:https://angular-ui.github.io/ui-router/site/#/api/ui.router) 通常被认为是 AngularJS 中复杂路由的最佳解决方案.

原答案:

到目前为止，在 AngularJS 中嵌套视图本身是不可能的.在我的上一个应用程序中，我使用了从这里派生的解决方案:http://www.bennadel.com/blog/2420-Mapping-AngularJS-Routes-Onto-URL-Parameters-And-Client-Side-Events.htm

允许我有效地嵌套视图(并完全跳过有限的 ng-view)

这样做之后，出现了另一个(我相信更简单、更好)的解决方案:

http://angular-ui.github.com/(向下滚动到路由检查")

看看吧！

I had two different apps in angular. During integration to a single application I had to

nest ng-views.

For sample (index.html) is

<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<title>My AngularJS App</title>
<link rel="stylesheet" href="css/app.css"/>
</head>
<body>
<ul class="menu">
<li><a href="#/view1">view1</a></li>
<li><a href="#/view2">view2</a></li>
</ul>

<div ng-view></div>

<div>Angular seed app: v<span app-version></span></div>

<script src="lib/angular/angular.js"></script>
<script src="js/app.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
</body>
</html>

One of my app view is (view2.html)

<div class="ng-view"></div>
<p>This is the partial for view 1.</p>
{{ 'Current version is v%VERSION%.' | interpolate }}

Now this application has different views once again inside it.

I tried but the page is not loading. Is there a possibility to nest ng-views?

If not Possible can it be explained

Thanks in advance

解决方案

Updated answer:

UI Router (which now sits here: https://angular-ui.github.io/ui-router/site/#/api/ui.router) is generally regarded as the best solution for complex routing in AngularJS.

Original answer:

Nesting views isn't natively possible, as of now, in AngularJS. In my last app, I used a solution derived from here: http://www.bennadel.com/blog/2420-Mapping-AngularJS-Routes-Onto-URL-Parameters-And-Client-Side-Events.htm

Allowing me to effectively nest views (and skipping the limited ng-view altogether)

After doing so, this other (simpler, better, I believe) solution appeared:

http://angular-ui.github.com/ (scroll down to "Route Checking")

Check it out!

这篇关于在 Angular js 中嵌套 ng-views的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！