角JS - 传递一个变量到$ routeProvider [英] angular js - passing a variable into $routeProvider

问题描述

试图找出一个特定角度的方式，试图实现这一目标。
我有一些看法的页面。当用户点击一个锚，观点的变化，这是我的工作就好了。

Trying to figure out an 'angular specific' way to try and achieve this. I have a page with some views. When a user clicks an anchor, the views change, which i have working just fine.

我很好奇，如果当用户点击，是有可能存储变量（比如内HTML），然后将它传递给 $ routeProvider 来多一点动态加载的看法？

What I'm curious is, if when the user clicks, is it possible to store a variable (say the inner html) then pass it to the $routeProvider to load the view a bit more dynamically?

所以锚标签＃名称1，显示该视图的时候，我可以通过名称1到 nameHolder 作为一个变量来加载具有相同名称的一些文件。

so for anchor tag #name1, when that view is displayed, I can pass "name1" into nameHolder as a variable to load some files with same name.

HTML

<script type="text/ng-template" id="this.html">

  This Page.
</script>
<script type="text/ng-template" id="that.html">
  That Page.
</script>


<div >
  <ul >
    <li><a href="#/this">this</a></li>
    <li><a href="#/that">that</a></li>
  </ul>
  <ng-view></ng-view>
</div>

JS

var nameHolder= [];

var app = angular.module( "myApp", ['ngRoute'] );

app.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/' + nameHolder, {
        templateUrl: nameHolder + ".html",
        controller: 'individ',
        nameofuser: nameHolder
    }).
      when('/', {
        templateUrl: 'this.html'
    });
}]);

app.controller('individ', function($scope, $route) {

    $scope.img =  $route.current.nameofuser;

});

$(document).ready(function(){
$('a').click(function(){
    nameHolder.length = 0;
   var pushThis = $(this).text();
    nameHolder.push(pushThis);
    console.log(nameHolder)
});
});

感谢您的任何信息。

Thanks for any info.

下面是一个的jsfiddle

推荐答案

您可以用函数 templateUrl 动态构造URL。这个函数接受的路径参数的对象：

You can use function for templateUrl to dynamically construct url. This function accepts an object of route parameters:

$routeProvider.
    when('/:nameHolder', {
        templateUrl: function(params) {
            return params.nameHolder + ".html";
        },
        controller: 'individ',
        nameofuser: nameHolder
}).

这篇关于角JS - 传递一个变量到$ routeProvider的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！