0

EDIT

The following question How do I empty an array in JavaScript? does not answer the question i.e. I get how to set / reset an array but that was not my question. I want to to do is:

  1. set the key with a dynamic value e.g. UUID and,
  2. then set element[0] (the above) to true in one line of code.

QUESTION

Code base: Angular 1.5x, lodash 4.x

Seems like a basic question but cannot find an answer. Is it possible using JS, Angular or lodash to reset an array and set it at the same time per the example below. As per the example below the array will keep pushing unless I set reset it. Why you ask, example if I'm using a UUID as key in the HTML e.g.

HTML

<li id="{[{contactus.app_id}]}"
    ng-show="view.state[item.uuid]"
    ng-repeat="item in collection.items track by item.uuid">
</li>

JS (Angular)

NOTE: this code works and I could also use replace $scope.view.state.length = 0; with $scope.view.state = []; but my question is more along the lines of reseting an array, adding a dynamic key and setting it to true all in one line of code. The complexity is in the dynamic key.

$scope.view = {state:[]};

$scope.setViewState = function (id) {
    // how can I collapse the following 2 lines of code into one
    $scope.view.state = [];
    $scope.view.state[id] = true;
};
8
  • Is id a string or a number? (Because if it's a non-numeric string setting length to 0 isn't doing what you think it's doing). Commented May 18, 2016 at 15:50
  • A string - on the backend I add a alpha prefix to uuid and dehydrate of hyphens. The code above works, I'm wondering how to get it into 1 line of code. Commented May 18, 2016 at 15:57
  • 1
    You'll want to change from an array [] to an object {} - then you can make your re-assignment into $scope.view.state = {[id] = true}; using a computed property. (But if you need to support older browsers then you'll need to use two lines for now.) Commented May 18, 2016 at 16:58
  • sean, cannot set {[id] = true} as I get js:45 Uncaught SyntaxError: Unexpected token = ... that is the problem as you need to set a dynamic key with a array[dynamicProperty] and cannot set dynamic key inside of object Commented May 18, 2016 at 20:19
  • You can but only in latest Chrome and Firefox - and any build tools you are using have to support the syntax as well. Commented May 18, 2016 at 21:51

1 Answer 1

1

You can use computed properties to do this in one line:

$scope.view.state = {[id]: true};

However, this will only work on the latest browsers (Chrome, Firefox, Safari 7.1+, and Edge) and if you have any build steps that need to parse your code they will also need to be upgraded to understand the syntax as well.

If you need older browser support (or if your build tools cannot be upgraded) then you'll need to do it in two steps. However, you can hide those steps in a function:

function initialState(key, value) {
  var result = {};
  result[key] = value;
  return result;
}

then you can simply do:

$scope.view.state = initialState(id, true);
Sign up to request clarification or add additional context in comments.

1 Comment

Sean, thanks a million. Based on your answer I will stick with 2 lines as some of my users will have older browsers. I'm suspect the reason for browser dependency is version of angular/ js? I'll go do some research as I'm intrigued

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.