Javascript AngularJS-使用自定义ng隐藏函数重复ng

我试图显示一个由URL哈希值过滤的博客文章结果的简单列表

我将此作为参考：

JSON:

 "nodes": [
      {
        "node": {
          "title": "Lorem ipsum dolor sit amet",
          "body": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nunc ante, ultrices non justo sed, interdum dictum diam. Aliquam erat volutpat. Donec orci sapien, facilisis vehicula dui non, interdum gravida tortor. Suspendisse mollis enim purus, eu ornare erat semper id. In ac molestie lorem. Nullam bibendum non augue eu viverra. Phasellus interdum sem quis blandit sagittis.\nVivamus mollis tortor ligula, eu porttitor nisi tempor sit amet. Integer vitae suscipit quam, sit amet pharetra justo. Integer erat dolor, venenatis a imperdiet in, mattis in dui. Nunc aliquet dictum tellus a maximus. Nam a semper tortor. Phasellus maximus congue vehicula. Nullam purus purus, auctor ac est et, varius fermentum augue.\nPellentesque ante erat, pretium cursus dolor id, rhoncus sagittis justo. Pellentesque convallis ante fringilla velit iaculis, id condimentum turpis laoreet. Maecenas non nisi et dui mollis malesuada. Proin viverra vel erat vel interdum. Suspendisse condimentum, enim nec porttitor euismod, turpis odio pharetra neque, ac condimentum tellus quam vel sapien. Sed ut vehicula ligula. In nec nunc metus. Donec eget interdum velit.\n",
          "photo": "http:\/\/local.bpdnew.com\/sites\/default\/files\/styles\/blog_-_landing_page_results\/public\/Cary1515building.jpg?itok=eSxNzF7a",
          "tags": "Healthcare, Bicycle, Pickles",
          "link": "\/content\/lorem-ipsum-dolor-sit-amet"
        }
      },
      {
        "node": {
          "title": "Curabitur sit amet arcu non orci porttitor cursus",
          "body": "Curabitur sit amet arcu non orci porttitor cursus. Curabitur semper erat nisl, nec placerat nunc tincidunt consectetur. Proin a feugiat magna. Ut vel magna at velit tempus ornare tempus malesuada nunc. Duis pellentesque molestie ipsum, id luctus mi lobortis sit amet. Aliquam consectetur purus ultrices tortor porta, et consequat nisi volutpat. Proin nec commodo mauris. Etiam sodales bibendum iaculis. Curabitur at tempor ligula. Aliquam sapien mi, mattis nec aliquam elementum, tempus a orci. Pellentesque erat nisi, tempor non mi et, lobortis gravida nunc. Etiam lectus tellus, porttitor quis congue quis, viverra luctus massa. Donec finibus leo at purus congue, consequat ullamcorper massa aliquam. Phasellus felis odio, aliquet et enim sit amet, eleifend pharetra orci. Vestibulum fermentum ligula neque, et scelerisque purus vulputate in. Curabitur ligula risus, imperdiet vitae justo quis, auctor rhoncus eros.\nMaecenas iaculis suscipit neque, sed imperdiet urna fringilla eu. Maecenas arcu augue, venenatis nec pharetra quis, consequat sed tortor. Ut mattis posuere vulputate. Aenean in eleifend quam. Quisque ultricies neque sed molestie semper. Ut ullamcorper nisl nisl, non facilisis enim rhoncus sit amet. Morbi condimentum convallis justo eu ultricies. Ut consequat imperdiet congue. Sed bibendum dictum quam. Nulla nulla sem, tempor vel mi id, posuere porta purus. Sed elementum lacinia orci sagittis consectetur. Donec non augue rutrum, blandit est tempus, scelerisque ante. Nulla quis nisl elementum, aliquet metus vel, sodales augue. Integer auctor sed lectus vel tristique.\n",
          "photo": "http:\/\/local.bpdnew.com\/sites\/default\/files\/styles\/blog_-_landing_page_results\/public\/hero_0.jpg?itok=Ra7m3QYS",
          "tags": "Lorem Ipsum, Dolor, Sit Amet",
          "link": "\/content\/curabitur-sit-amet-arcu-non-orci-porttitor-cursus"
        }
      },
      {
        "node": {
          "title": "Vivamus mollis tortor ligula",
          "body": "Pellentesque ante erat, pretium cursus dolor id, rhoncus sagittis justo. Pellentesque convallis ante fringilla velit iaculis, id condimentum turpis laoreet. Maecenas non nisi et dui mollis malesuada. Proin viverra vel erat vel interdum. Suspendisse condimentum, enim nec porttitor euismod, turpis odio pharetra neque, ac condimentum tellus quam vel sapien. Sed ut vehicula ligula. In nec nunc metus. Donec eget interdum velit.\nCurabitur sit amet arcu non orci porttitor cursus. Curabitur semper erat nisl, nec placerat nunc tincidunt consectetur. Proin a feugiat magna. Ut vel magna at velit tempus ornare tempus malesuada nunc. Duis pellentesque molestie ipsum, id luctus mi lobortis sit amet. Aliquam consectetur purus ultrices tortor porta, et consequat nisi volutpat. Proin nec commodo mauris. Etiam sodales bibendum iaculis. Curabitur at tempor ligula. Aliquam sapien mi, mattis nec aliquam elementum, tempus a orci. Pellentesque erat nisi, tempor non mi et, lobortis gravida nunc. Etiam lectus tellus, porttitor quis congue quis, viverra luctus massa. Donec finibus leo at purus congue, consequat ullamcorper massa aliquam. Phasellus felis odio, aliquet et enim sit amet, eleifend pharetra orci. Vestibulum fermentum ligula neque, et scelerisque purus vulputate in. Curabitur ligula risus, imperdiet vitae justo quis, auctor rhoncus eros.\n",
          "photo": "http:\/\/local.bpdnew.com\/sites\/default\/files\/styles\/blog_-_landing_page_results\/public\/aerial-shot_0.jpg?itok=2R4SE7pI",
          "tags": "Donec, Pineapple, Healthcare",
          "link": "\/content\/vivamus-mollis-tortor-ligula"
        }
      },
      {
        "node": {
          "title": "Nunc aliquet dictum tellus a maximus",
          "body": "Vivamus mollis tortor ligula, eu porttitor nisi tempor sit amet. Integer vitae suscipit quam, sit amet pharetra justo. Integer erat dolor, venenatis a imperdiet in, mattis in dui. Nunc aliquet dictum tellus a maximus. Nam a semper tortor. Phasellus maximus congue vehicula. Nullam purus purus, auctor ac est et, varius fermentum augue.\nPellentesque ante erat, pretium cursus dolor id, rhoncus sagittis justo. Pellentesque convallis ante fringilla velit iaculis, id condimentum turpis laoreet. Maecenas non nisi et dui mollis malesuada. Proin viverra vel erat vel interdum. Suspendisse condimentum, enim nec porttitor euismod, turpis odio pharetra neque, ac condimentum tellus quam vel sapien. Sed ut vehicula ligula. In nec nunc metus. Donec eget interdum velit.\nCurabitur sit amet arcu non orci porttitor cursus. Curabitur semper erat nisl, nec placerat nunc tincidunt consectetur. Proin a feugiat magna. Ut vel magna at velit tempus ornare tempus malesuada nunc. Duis pellentesque molestie ipsum, id luctus mi lobortis sit amet. Aliquam consectetur purus ultrices tortor porta, et consequat nisi volutpat. Proin nec commodo mauris. Etiam sodales bibendum iaculis. Curabitur at tempor ligula. Aliquam sapien mi, mattis nec aliquam elementum, tempus a orci. Pellentesque erat nisi, tempor non mi et, lobortis gravida nunc. Etiam lectus tellus, porttitor quis congue quis, viverra luctus massa. Donec finibus leo at purus congue, consequat ullamcorper massa aliquam. Phasellus felis odio, aliquet et enim sit amet, eleifend pharetra orci. Vestibulum fermentum ligula neque, et scelerisque purus vulputate in. Curabitur ligula risus, imperdiet vitae justo quis, auctor rhoncus eros.\n",
          "photo": "http:\/\/local.bpdnew.com\/sites\/default\/files\/styles\/blog_-_landing_page_results\/public\/imac-transparent-background.png?itok=DSzHmRUx",
          "tags": "Lorem Ipsum, Healthcare",
          "link": "\/content\/nunc-aliquet-dictum-tellus-maximus"
        }
      },
      {
        "node": {
          "title": "Morbi condimentum convallis justo eu ultricies",
          "body": "Vivamus mollis tortor ligula, eu porttitor nisi tempor sit amet. Integer vitae suscipit quam, sit amet pharetra justo. Integer erat dolor, venenatis a imperdiet in, mattis in dui. Nunc aliquet dictum tellus a maximus. Nam a semper tortor. Phasellus maximus congue vehicula. Nullam purus purus, auctor ac est et, varius fermentum augue.\nPellentesque ante erat, pretium cursus dolor id, rhoncus sagittis justo. Pellentesque convallis ante fringilla velit iaculis, id condimentum turpis laoreet. Maecenas non nisi et dui mollis malesuada. Proin viverra vel erat vel interdum. Suspendisse condimentum, enim nec porttitor euismod, turpis odio pharetra neque, ac condimentum tellus quam vel sapien. Sed ut vehicula ligula. In nec nunc metus. Donec eget interdum velit.\nCurabitur sit amet arcu non orci porttitor cursus. Curabitur semper erat nisl, nec placerat nunc tincidunt consectetur. Proin a feugiat magna. Ut vel magna at velit tempus ornare tempus malesuada nunc. Duis pellentesque molestie ipsum, id luctus mi lobortis sit amet. Aliquam consectetur purus ultrices tortor porta, et consequat nisi volutpat. Proin nec commodo mauris. Etiam sodales bibendum iaculis. Curabitur at tempor ligula. Aliquam sapien mi, mattis nec aliquam elementum, tempus a orci. Pellentesque erat nisi, tempor non mi et, lobortis gravida nunc. Etiam lectus tellus, porttitor quis congue quis, viverra luctus massa. Donec finibus leo at purus congue, consequat ullamcorper massa aliquam. Phasellus felis odio, aliquet et enim sit amet, eleifend pharetra orci. Vestibulum fermentum ligula neque, et scelerisque purus vulputate in. Curabitur ligula risus, imperdiet vitae justo quis, auctor rhoncus eros.\nMaecenas iaculis suscipit neque, sed imperdiet urna fringilla eu. Maecenas arcu augue, venenatis nec pharetra quis, consequat sed tortor. Ut mattis posuere vulputate. Aenean in eleifend quam. Quisque ultricies neque sed molestie semper. Ut ullamcorper nisl nisl, non facilisis enim rhoncus sit amet. Morbi condimentum convallis justo eu ultricies. Ut consequat imperdiet congue. Sed bibendum dictum quam. Nulla nulla sem, tempor vel mi id, posuere porta purus. Sed elementum lacinia orci sagittis consectetur. Donec non augue rutrum, blandit est tempus, scelerisque ante. Nulla quis nisl elementum, aliquet metus vel, sodales augue. Integer auctor sed lectus vel tristique.\n",
          "photo": "http:\/\/local.bpdnew.com\/sites\/default\/files\/styles\/blog_-_landing_page_results\/public\/macbook-transparent-background.png?itok=CWIhmUGB",
          "tags": "Holiday, Healthcare, Pickles",
          "link": "\/content\/morbi-condimentum-convallis-justo-eu-ultricies"
        }
      }
    ]

HTML:

如果我使用“console.log（$scope.isExcludedByFilter）；”进行控制台输出，它会正确地提供“true”或“false”；但是如果我使用“console.log（$scope）；”深入范围，它会在每个节点对象上显示为“undefined”

我还是个新手

---

提前感谢。

好的，这里的主要问题是

$scope.post

没有定义，您必须将

post

变量传递给您的

applySearchFilter

函数，因此您应该这样做：

ng-hide="isExcludedByFilter(post);"

您的函数应该如下所示：

function applySearchFilter(post) {
    var filter = $location.hash();
    var tags = post.node.tags;
    var isSubstring = ( tags.indexOf( filter ) !== -1 );

    // If the filter value is not a substring of the
    // tags, we have to exclude it from view.
    return !isSubstring;
}

因此，您必须传递

post

变量，使用该变量，然后返回是否应该隐藏该行

还有一件事，您应该将对函数的引用传递到您的作用域，而不是函数的返回：

$scope.isExcludedByFilter = applySearchFilter;

传递

applySearchFilter（）

将传递函数的返回，该函数以前未定义，但您希望传递引用，因此可以从HTML调用它

function applySearchFilter(post) {
    var filter = $location.hash();
    var tags = post.node.tags;
    var isSubstring = ( tags.indexOf( filter ) !== -1 );

    // If the filter value is not a substring of the
    // tags, we have to exclude it from view.
    return !isSubstring;
}

$scope.isExcludedByFilter = applySearchFilter;