角ngRoute：力纳克 - 浏览内容，以便事后导航 [英] Angular-ngRoute: force ng-view contents, allow navigation afterwards

问题描述

当使用ngRoute，我想有角配置，以便纳克视图的当前内容被留下作为当前路线的内容，并允许用户导航离开到不同的路线，之后呈现各自的模板：

While using ngRoute, I want to have Angular configured so that the current contents of ng-view are left as the contents for the current route, and allow the user to navigate away to different routes, rendering their respective templates afterwards:

HTML

<ul class="menu">
  <li><a href="#/view1">view1</a></li>
  <li><a href="#/view2">view2</a></li>
</ul>

<div ng-view>
  <ul>
    <li>Some</li>
    <li>Soon obliterated</li>
    <li>Content</li>
  </ul>
</div>

的JavaScript

angular.module('myApp', ['ngRoute'])
.config(function($routeProvider) {
  $routeProvider
  .when('/view1', {
    templateUrl: 'view1.html',
    controller: 'View1Ctrl'
  })
  .when('/view2', {
    templateUrl: 'view2.html',
    controller: 'View2Ctrl'
  })
  .otherwise({
    redirectTo: '/view1'
  })
})
.controller('View1Ctrl', function() {

})
.controller('View2Ctrl', function() {

});

---

当用户第一次看到的页面，我希望他看到以下内容：的

---

When the user first sees the page, I want him to see the following:

<青霉>注意：角需要在这点上被自举，以指示在这方面的作用的

的注2：此内容应该是在页面的实际的HTML，而不是在模板或脚本标记的

然后，当点击视图2链接：的

Then, when the 'view2' link is clicked:

然后，当点击视图1链接：的

And then, when the 'view1' link is clicked:

我首先想到的是用 $ route.updateParams（newParams），但我认为这不是真正的目的。

My first thought was using $route.updateParams(newParams) but I think that's not really its purpose.

修改
最后我用

//Server-side rendered code

myModule
.config(['$routeProvider', function($routeProvider){
    $routeProvider.when('<# my current route #>',
        {
            templateUrl: '/server-static',
        });

 angular.bootstrap(myModule);

在app.js：

 myModule
    .config('$routeProvider', function($routeProvider){
        $routeProvider.when('/my-client-routes',
            {
                templateUrl: '/my-template.html',
            }); // etc.

我怎么能招的角，以为 NG-视图的内容是当前条目路线此时，相应的内容是什么？可我只是取消的路由解析/ ngView指令（或使其transclude）渲染第一负荷？或者，如果不可能的，什么是preferred方法来做到这一点？

How can I trick Angular into thinking that the contents of ng-view are the appropiate contents for the current entry route? Can I just cancel route resolution/ngView directive (or make it transclude) rendering for first load? Or if not possible, what's the preferred method to do this?

感谢

编辑：查看的提议加入NG-视图的内容这个答案 $ templateCache 通过自定义指令。

See this answer that proposes adding the contents of ng-view to $templateCache through a custom directive.

推荐答案

这是可能的 templateUrl 是一个函数。在这种情况下，您可以根据某种状态的真正改变观点：

It's possible for templateUrl to be a function. In which case you can actually change the view based on some kind of state:

var initialized = false;

$routeProvider
.when('/view1', {
 templateUrl: function(){
   if(initialized){ 
     return 'view1.html';
   }

   initialized = true;

   return 'view-initial.html';
 },
 controller: 'View1Ctrl'
})

下面是一个工作Plunker 可根据你的了。

Here is a working Plunker based on yours.

这篇关于角ngRoute：力纳克 - 浏览内容，以便事后导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！