Angularjs ng-click and collapse getting errors

Question

    <a ng-click="vm.getComment(post);isCollapsed{{post._id}} = !isCollapsed{{post._id}}">

I have written above code for display multiple collapsed on every
click display that particular list and go belove error can any one tell me the above line is correct or not

angular.js:13920 Error: [$parse:syntax] http://errors.angularjs.org/1.5.8/$parse/syntax?p0=%7B&p1=is%20an%20unexpected%20token&p2=32&p3=vm.getComment(post)%3BisCollapsed%7B%7Bpost._id%7D%7D%20%3D%20!isCollapsed%7B%7Bpost._id%7D%7D&p4=%7B%7Bpost._id%7D%7D%20%3D%20!isCollapsed%7B%7Bpost._id%7D%7D at http://localhost:6161/lib/angular/angular.min.js:6:412 at s.throwError at kc.parse (http://localhost:6161/lib/angular/angular.min.js:276:122) at oa (http://localhost:6161/lib/angular/angular.min.js:71:38) at s (http://localhost:6161/lib/angular/angular.min.js:59:121) at s (http://localhost:6161/lib/angular/angular.min.js:59:253)

wrong syntax isCollapsed{{post._id}}, try isCollapsed(post._id) — Aleksey Solovey
– Aleksey Solovey, Commented Feb 27, 2018 at 10:47
what do you want to achieve fromisCollapsed{{post._id}} .... is it complete string or isCollapsed is a function — Kiran Shinde
– Kiran Shinde, Commented Feb 27, 2018 at 10:58
isCollapsed is not a function I used it as a variable for assigne Id like isCollapsed{{ID_place_here}} like this way — Smit Patel
– Smit Patel, Commented Feb 27, 2018 at 11:18

Aleksey Solovey · Accepted Answer · 2018-02-27 12:08:22Z

1

You can't concatenate scoped variables as a string and expect to turn into a variable with that name. I suggest using an object or/and an array to store the information about the posts and simply toggle the booleans for each object. Here is a quick demo:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.ids = [10, 21, 34, 100];
  $scope.isCollapsed = {
    "10": false,
    "21": false,
    "34": false,
    "100": false
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<div ng-app="myApp" ng-controller="myCtrl">
  <div ng-repeat="id in ids">
    <button ng-click="isCollapsed[id] = !isCollapsed[id]">
      Hide {{id}}
    </button> <br>
    {{isCollapsed[id]}}
    <hr>
  </div>
</div>

answered Feb 27, 2018 at 12:08

Aleksey Solovey

4,1663 gold badges18 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angularjs ng-click and collapse getting errors

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related