首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何将模板中的唯一id匹配到控制器中的过滤器函数?

如何将模板中的唯一id匹配到控制器中的过滤器函数?
EN

Stack Overflow用户
提问于 2015-07-10 18:41:44
回答 1查看 80关注 0票数 0

这是我的app.js

代码语言:javascript
复制
.state('app.study_collections', {
    url: "/studies/:studynodeRef",
    views: {
      'menuContent': {
        templateUrl: "templates/rubyonic/overview.html"
      }
    }
})

这是我的studies.html的一个片段

代码语言:javascript
复制
<div class="feed-item">
  <div class="feed-media" ng-repeat="study in studies">
    <img src="{{study.image}}" class="feed-image">
    <div class="feed-gradient-overlay"></div>
    <a href="#/app/studies/{{study.nodeRef}}">
       <h4 class="feed-title">{{study.title}}</h4>
    </a>
  </div>
</div>

这是我的controller.js的一个片段

代码语言:javascript
复制
Studies.all().then(function(payload){
   $scope.studies = payload;
});

Studies.all().then(function(studies){
   $scope.study = $filter('filter')(studies, function (d) {return d.nodeRef === '"'+ $stateParams.studynodeRef + '"';})[0];
});

因此,Studies.all()调用学习服务,该服务对json文件进行异步调用以获取数据。

代码语言:javascript
复制
Studies.all().then(function(payload){
  $scope.studies = payload;
});

这将获得在studies.html文件中迭代的所有研究的列表。每项研究都有其独特的nodeRef。当您单击研究时,它会映射到url "#/app/studies/{{study.nodeRef}}"。在此之后,我想使用该nodeRef从研究集合中筛选出一个研究对象。

代码语言:javascript
复制
Studies.all().then(function(studies){
$scope.study = $filter('filter')(studies, function (d) {return d.nodeRef === '"'+ $stateParams.studynodeRef + '"';})[0];
});

其中,d.nodeRef === '"'+ $stateParams.studynodeRef + '"'将其与正确的nodeRef匹配,并过滤掉该研究。但是,当我试图像{{study}}这样简单地在模板中打印研究时,什么都不会出现,而且当我做console.log()时,它是没有定义的。

我该怎么解决这个问题?如果需要澄清,请告诉我。

编辑

我对我的控制器做了一些修改。我现在可以从url访问nodeRef,但由于某种原因,它在我的过滤器函数中无法工作,除非我手动输入它。看看这里,https://gist.github.com/shubhamsinha92/01b492c62c4dd5ad3a7c

这就是我的services.js的样子:

代码语言:javascript
复制
var app = angular.module('starter.services', [])


.factory('Studies',function($http,$filter,$q){
    var deferred = $q.defer();
    var studies = [];
    $http.get("studies.json").success(
            function(data){
                //studies = data;
                angular.copy(data, studies);
                //At this point you can filter data as required, or not at all. I would suggest returning the entire JSON response and not filtering here at all, let the controllers filter the data as needed to maintain a layer of separation between controller and service.

                deferred.resolve(studies);
            }
        );

  return {
    all: function(){
      return deferred.promise;
    }
};
})
EN

回答 1

Stack Overflow用户

发布于 2015-07-10 20:51:00

这似乎是你在把'nodeId‘和’nodeId‘进行比较。

原创

代码语言:javascript
复制
$filter('filter')(payload, function (d) {
    $scope.id = '"' + $rootScope.nodeId + '"';
    return d.nodeRef === $scope.id ;})[0]; 

解决方案

代码语言:javascript
复制
$filter('filter')(payload, function (d) {
  $scope.id = "" + $rootScope.nodeId;
  if (d.nodeRef === $scope.id)
    return d;})[0]; 

请看这个例子

https://jsfiddle.net/HB7LU/15157/

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31348064

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档