Ruby on rails 我怎样才能做出一个条件语句，比如；包括？“；Ruby-on-ng-if中的方法

很抱歉，我很难把标题说清楚。我会尽可能多地解释

我使用Rails作为后端（API），AngularJS作为前端

我从articleCtrl中获得了几个被喜欢（竖起拇指）的article_ID，名为$scope.article_has_like（它是一个数组，包含几个article_ID，如[24,45,55]），如下所示：

articleCtrl.js.coffee

$http.get(url).success((data)->
console.log(data)
$scope.articles = data.articles
$scope.topic = data.topic
$scope.article_has_liked = data.article_has_liked
)

我将这些article_id（$scope.article_has_like）传递到show.html，以便使用“ng if”进行判断，如下所示：

Error: Syntax Error: Token 'undefined' expected : at column NaN of the expression [article_has_liked.include?(article.id)] starting at [article_has_liked.include?(article.id)].
throwError@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6672:1
ternary@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6827:9
_assignment@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6800:16
expression@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6796:12
_filterChain@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6762:16
statements@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6742:25
parser@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6661:13
$ParseProvider/this.$get</<@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:7282:1
compileToFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:9215:16
$RootScopeProvider/this.$get</Scope.prototype.$watch@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:8547:19
ngIfDirective</<.compile/<@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:14677:9
nodeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4960:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4539:15
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
publicLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4456:30
ngRepeatAction@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:15463:15
$watchCollectionAction@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:8718:11
$RootScopeProvider/this.$get</Scope.prototype.$digest@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:8812:21
$RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:9013:13
done@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:10266:34
completeRequest@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:10450:7
createHttpBackend/</xhr.onreadystatechange@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:10405:1
 <!-- ngIf: article_has_liked.include?(article.id) -->

Show.html

<div ng-if="article_has_liked.include?(article.id)">
    <button class="btn btn-link" ng-click="likeItOrNot(article.id, topic.id)">
    <span class="glyphicon glyphicon-star"></span>
    </button>
</div>
<div ng-if="article_has_liked.exclude?(article.id)">
    <button class="btn btn-link" ng-click="likeItOrNot(article.id, topic.id)">
    <span class="glyphicon glyphicon-star-empty"></span>
    </button>
</div>

问题来了

我想用。包括吗？方法来确定article.id是否包含在已被喜欢的article\u id中。如果喜欢，我会给它一颗实心的星星。但是我发现Angular似乎不接受这个用法，它返回的错误如下：

Error: Syntax Error: Token 'undefined' expected : at column NaN of the expression [article_has_liked.include?(article.id)] starting at [article_has_liked.include?(article.id)].
throwError@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6672:1
ternary@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6827:9
_assignment@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6800:16
expression@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6796:12
_filterChain@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6762:16
statements@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6742:25
parser@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:6661:13
$ParseProvider/this.$get</<@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:7282:1
compileToFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:9215:16
$RootScopeProvider/this.$get</Scope.prototype.$watch@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:8547:19
ngIfDirective</<.compile/<@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:14677:9
nodeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4960:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4539:15
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
compositeLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4554:13
publicLinkFn@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:4456:30
ngRepeatAction@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:15463:15
$watchCollectionAction@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:8718:11
$RootScopeProvider/this.$get</Scope.prototype.$digest@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:8812:21
$RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:9013:13
done@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:10266:34
completeRequest@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:10450:7
createHttpBackend/</xhr.onreadystatechange@http://localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js?body=1:10405:1
 <!-- ngIf: article_has_liked.include?(article.id) -->

Error:Syntax Error:Token'undefined'应为：在表达式[article\u has\u liked.include？（article.id）]的NaN列，从[article\u has\u liked.include？（article.id）]开始。
throwError@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6672:1
ternary@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6827:9
_assignment@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6800:16
expression@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6796:12
_filterChain@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6762:16
statements@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6742:25
parser@http：//localhost:3000/assets/angular.self-cdfe10db265380c82ec938d307fce2720dc9fb9d8cfa21c78928031af124e282.js？body=1:6661:13
$ParseProvider/this.$get
更新到这一个：

ng-if="article_has_liked.include?(article.id):false value here"

更新到这一个：

ng-if="article_has_liked.include?(article.id):false value here"

这是一个与JavaScript相关的问题，而不是AngularJS。但这可以回答你的问题：

通常需要检查数组是否包含特定项。您可以通过使用该方法来实现这一点。如果代码在列表中找不到该项，则返回
-1

var article_has_liked = [24,45,55];
if(article_has_liked.indexOf(99) == -1){
 alert("data not found");
}

不确定，但你可以试试：

<div ng-if="article_has_liked.indexOf(article.id) != -1"> 



注意：上述条件用于检查是否包含。如果它在article_has_喜欢的内容中包含您的article.id，则只执行该块。如果要选中“排除”

，只需使用

==

即可=我希望它对您有用。

这是一个与JavaScript相关的问题，而不是AngularJS。但这可以回答你的问题：

通常需要检查数组是否包含特定项。您可以通过使用该方法来实现这一点。如果代码在列表中找不到该项，则返回

-1

var article_has_liked = [24,45,55];
if(article_has_liked.indexOf(99) == -1){
 alert("data not found");
}

不确定，但你可以试试：

<div ng-if="article_has_liked.indexOf(article.id) != -1"> 

---

注意：上述条件用于检查是否包含。如果它在article_has_喜欢的内容中包含您的article.id，则只执行该块。如果要选中“排除”，只需使用

==

即可=我希望它能为您工作。

请再次检查错误。它与空错误无关，与语法错误无关。@Shrikant:我刚刚给出了以JS方式实现其要求的选项。很好，它包含了一点内容。感谢您的回复。但是我是JS新手，所以不知道如何正确地实现它。@Alanyeh:你可以使用我所展示的。我已经更新了两种情况下的答案

include

和

exclude

请再次检查错误。这与空错误及其语法错误无关。@Shrikant:我刚刚给出了以JS方式实现其要求的选项。很好，已经涵盖了一点。感谢您的回复。但是我是JS新手，所以不知道如何正确地实现它。@Alanyeh:你可以使用我所展示的。我已经更新了两种情况下的答案

include

和

exclude

，因为我可以看到您正在使用三元运算符。根据ruby语法，哪种语法不正确。应该是你喜欢的

文章。包括？（article.id）？true\u block:false\u block

js文件中的错误。请将其签出并添加到html文件中。此方法可以消除语法错误，但当article\u喜欢时。include？（article.id）为true时，按钮仍然不显示，并且我不确定问题出在哪里。我可以看出您使用的是三元运算符。根据ruby语法，哪种语法不正确。应该是你喜欢的

文章。包括？（article.id）？true\u block:false\u block

js文件中的错误。请将其签出并添加到html文件中。此方法可以消除语法错误，但当article\u喜欢。include？（article.id）为true时，按钮仍然不会显示，我不确定问题出在哪里。