简体   繁体   English

单击单选按钮时是否过滤用户详细信息?

[英]Filter user details when clicking on a radio button?

How can i filter user details when clicking on a radio button? 单击单选按钮时如何过滤用户详细信息?

Plunker 柱塞

*Actually, I want to filter authenticate user questions in the list page, so I have created a plunker. *实际上,我想在列表页面中过滤认证用户的问题,因此我创建了一个插件。 If i'm an authenticated user (or) admin, I want to filter myquestions only in the list page. 如果我是经过身份验证的用户(或)管理员,则只想在列表页面中过滤myquestions

For Example :- in plunker my displayName is Table 1 means if I click My Question radio button, my questions only need to filter . 例如:-在plunker中,我的displayNameTable 1意味着如果单击“ My Question单选按钮,则只需要filter我的问题。

My HTML radio button:- 我的HTML单选按钮:-

<input type="radio" name="myquestion" data-ng-model="myquestion.user.displayName" value="myquestion" >

My HTML Filter:- 我的HTML过滤器:-

    ng-repeat="question in questions | filter: myquestion"

**My Html Data:-**

<div ng-repeat="question in questions | filter: myquestion">
    <small>
                      Posted on
                      <span data-ng-bind="question.created | date:'mediumDate'"></span>
                      <span data-ng-bind="question.user.displayName"></span>
                  </small>

  </div>

My Controller Data:- 我的控制器数据:

$scope.questions = [
{
"_id": "583433ddc021a5d02949a51b",
"user": {
"_id": "5834336ac021a5d02949a51a",
"displayName": "mani R",
"location": "ICF",
"dob": "1991-10-05T18:30:00.000Z",
"religion": "Christian",
"roles": [
"user"
],
"profileImageURL": "modules/users/client/img/profile/default.png"
},
"__v": 0,
"upvoters": [],
"category": "Moral Ethics",
"content": "Dhoni",
"title": "which batsman is best in the world?",
"created": "2016-11-22T12:02:37.376Z"
},
{
"_id": "582c34b3ff26bd603e1e5383",
"user": {
"_id": "58072aba0f82a61823c434df",
"displayName": "Table 1",
"dob": "1991-10-04T18:30:00.000Z",
"location": "Icf",
"religion": "Hindu",
"roles": [
"admin"
],
"profileImageURL": "./modules/users/client/img/profile/uploads/c756711556ab6864f408697c7a98aedc"
},
"__v": 1,
"upvoters": [],
"users": [],
"comments": [
{
"created": 1479365394684,
"email": "ms@e21designs.com",
"name": "Table 1",
"commentText": "Dhoni"
}
],
"friend_tag": [],
"emotion": "Confused",
"category": "Environment & Health",
"content": "sachin?",
"title": "who is best player in this world?",
"created": "2016-11-16T10:28:03.859Z"
},
{
"_id": "582c3418ff26bd603e1e5382",
"user": {
"_id": "582c1f4b53cf7fec2ddf282e",
"displayName": "selvam R",
"dob": "1991-10-04T18:30:00.000Z",
"roles": [
"kp"
],
"profileImageURL": "modules/users/client/img/profile/default.png"
},
"__v": 0,
"upvoters": [],
"category": "Environment & Health",
"content": "he is tennis player",
"created": "2016-11-16T10:25:28.835Z"
},
{
"_id": "582ad554714543e037cf3bf2",
"user": {
"_id": "58072aba0f82a61823c434df",
"displayName": "Table 1",
"dob": "1991-10-04T18:30:00.000Z",
"location": "Icf",
"religion": "Hindu",
"roles": [
"admin"
],
"profileImageURL": "./modules/users/client/img/profile/uploads/c756711556ab6864f408697c7a98aedc"
},
"__v": 1,
"upvoters": [
"ms@e21designs.com"
],
"upvotes": 1,
"category": "Moral Ethics",
"created": "2016-11-15T09:28:52.403Z"
},
{
"_id": "5821e7c667b70aac2b8fdfdc",
"user": {
"_id": "58072aba0f82a61823c434df",
"displayName": "Table 1",
"dob": "1991-10-04T18:30:00.000Z",
"location": "Icf",
"religion": "Hindu",
"roles": [
"admin"
],
"profileImageURL": "./modules/users/client/img/profile/uploads/c756711556ab6864f408697c7a98aedc"
},
"__v": 1,
"upvoters": [
"ms@e21designs.com"
],
"upvotes": 1,
"category": "Religion & Culture",
"created": "2016-11-08T14:57:10.354Z"
}
]
  • We tried alt="{{vm.authentication.user.displayName}}" but it's not working perfectly. 我们尝试了alt="{{vm.authentication.user.displayName}}"但工作不正常。

I think what youre trying to do was to filter the list base on displayName of logged in user, right? 我认为您要执行的操作是根据已登录用户的displayName过滤列表,对吗? I dont know if you guys have a service for user auth I just assume that Table 1 was the given logged in user. 我不知道你们是否为用户身份验证提供服务,我只是假设表1是给定的登录用户。 I use ng-change to detect if radio button is changed for me to filter all and myquestions. 我使用ng-change来检测单选按钮是否已更改,以便我过滤所有和myquestions。

on my controller: 在我的控制器上:

$scope.authUser = {
    "_id": "58072aba0f82a61823c434df",
    "displayName": "Table 1",
    "dob": "1991-10-04T18:30:00.000Z",
    "location": "Icf",
    "religion": "Hindu",
    "roles": [
      "admin"
    ],
    "profileImageURL": "./modules/users/client/img/profile/uploads/c756711556ab6864f408697c7a98aedc"
};

on html: 在html上:

   <div class="col-md-3" id="donate">
      <label class="green">
        <input type="radio" name="myquestion" ng-model="myQuestion" value="myquestion" ng-change="stateChange(myQuestion)">
        <span>My Questions</span>
      </label>
      <label class="green">
        <input type="radio" name="myquestion" ng-model="myQuestion" value="all" ng-change="stateChange(myQuestion)">
        <span>All</span>
      </label>
   </div>

   <div ng-repeat="question in questions | filter: { user.displayName: searchText }">
      <small>
        Posted on
        <span data-ng-bind="question.created | date:'mediumDate'"></span>
        <span data-ng-bind="question.user.displayName"></span>
      </small>
   </div>

For working sample I edited your plunkr. 对于工作样本,我编辑了您的plunkr。 here is the link http://plnkr.co/edit/U5M29NMfvtY0vTnQyjmT?p=preview 这是链接http://plnkr.co/edit/U5M29NMfvtY0vTnQyjmT?p=preview

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM