Angular Js:通过$ routeParams&获取来自URL的数据$范围

时间:2014-06-18 18:58:06

标签: javascript angularjs scope

我在使用Angular Js的$ scope中的$ routeParams尝试从我的URL传递一些数据时遇到了问题。这是我的HTML部分:

 <h1>This is: {{project[currentCat].id}}</h1>  //works
 <h3>test: {{project[currentCat].examples[currentEx].id}}</h3> //doesn't
 <h2>Category: {{project[currentCat].id | capitalize}}</h2>

h1标签的工作方式正如我在Javascript中设置的那样:

categoryControllers.controller('DataController', ['$scope', '$http','$routeParams',      function($scope, $http, $routeParams) {
$http.get('json/data.json').success(function(data) {
$scope.project = data;
$scope.currentCat = $routeParams.cat; //works
$scope.currentEx = $routeParams.ex; //works but unable to get data

我的应用配置:

.when('/:cat', {
  templateUrl: 'partials/details.html',  //works
  controller: 'DataController'
})
.when('/:cat/:ex', {
  templateUrl: 'partials/example.html',  //routes correctly but unable to get data
  controller: 'DataController'

})

最后是我的JSON结构:

{
"animation":{
    "id":"animation",
    "desc":"This is a description of animation",
    "images":{
        "src":"images/animation.jpg",
        "alt":"Animation image"
    },
    "examples":[
        {
            "id":"example1",
            "name":"animation project 1",
            "category":"animation",
        }
    ]
},

基本上我希望能够根据URL中的名称提取与示例相关的所有数据,但不知道如何制定下面的部分。

<h3>test: {{project[currentCat.id].examples[currentEx].id}}</h3>

编辑:以下是包含链接的上一部分的HTML:

<li ng-repeat="example in project[currentCat].examples">
  <a href="#/{{project[currentCat].id}}/{{example.id}}">
    <img ng-src="images/{{item.id}}.jpg" alt="Photo of {{example.name}}"></img>
    <div>
      <h2>{{example.name}}</h2>
      <h3>{{example.level}}</h3>
      <h3>{{example.desc}}</h3>
      <h3>{{item.Description}}</h3>
    </div>
  </a>
</li>

非常感谢任何帮助!

1 个答案:

答案 0 :(得分:-1)

您的链接将尝试访问#/ animation / eample1,并且您正尝试将其转换为 数据[动画]是有效的和数据['animation']。例子['example1']这不是因为例子是一个数组,如果你想使用转换数组所需的id,它需要通过数字索引加入哈希