How to reference a value of an object by property?

Question

I have an angularjs object like this:

$scope.afterLogin = [
    {value: 'customers|follow-ups', text: 'Follow Ups'},
    {value: '', text: 'not set'}
];

I'm trying to use it with xeditable as follows:

<span
    editable-select="user.default_module"
    e-ng-options="s.value as s.text for s in afterLogin"
    e-name="default_module"
    e-form="rowform">{{s[user.default_module] as s.text for s in afterLogin}}</span>

What I am trying is to show the text-property in afterLogin that is defined by user.default_module. What am I doing wrong? I am getting parse errors on s[user.default_module] as - how do I reference a property of an object in this scope?

Note: this is wrapped with ng-repeat="user in users".

Answer 1

You are trying to display currently selected value in a very strage way. In the official example they are using filter for this purpose. However, you can simplify it by builing a value: label map, i.e.:

$scope.afterLoginLabels = {};
for (var i = 0; i < $scope.afterLogin.length; i++) {
  $scope.afterLoginLabels[$scope.afterLogin[i].value] = $scope.afterLogin[i].text;   
}

Then, display text value as:

<span [...]>{{ afterLoginLabels[user.default_module] }}</span>

See JSFiddle.