How do I retrieve a value from an object using users' inputs? (Angularjs)

Question

I'm trying to calculate a rate automatically when a user gives the inputs.

A user can select one of the 3 items in the "types" list, and it should input the result of multiplying the multiplier (input), and the chosen object.

I tried a bunch of things (including interpolating on the controller), but can't seem to retrieve the rate in the object whose name is the same as the ng-model.

What can I do here?

HTML:

<div ng-app="myApp" ng-controller="myCtrl">

    <label>Input a multiplier</label></br>
    <input ng-model="h" /></br>

    <label>Which object do you want?</label></br>
    <select ng-model="objectType" ng-options="j for j in types"></select></br>

    <h1> {{ h * rates.objectType }} </h1>
</div>

Angularjs:

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {

    $scope.types = ["obj1", "obj2", "obj3"];
    $scope.rates = {
        obj1: 3,
        obj2: 5,
        obj3: 7
    }
});

`app.controller("myCtrl"), function($scope) {`... This is a typo, right? Should be `app.controller("myCtrl", function($scope) {` — Szabolcs Dézsi, Feb 17 '16 at 21:10
And also rates.objectType is not correct is it? You need the value of objectType. Like rates[objectType] — Mattias Nordqvist, Feb 17 '16 at 21:13

score 2 · Answer 1 · answered Feb 17 '16 at 21:09

2

Use [] object notation for variable property names

{{ h * rates[objectType] || 0 }}

The || 0 is an assumption that you want to show zero when either of the other values is undefined

answered Feb 17 '16 at 21:09

charlietfl

170,828
13
121
150

score 2 · Accepted Answer · answered Feb 17 '16 at 21:09

2

You can do it like this

{{h * rates[objectType] || 0}}

answered Feb 17 '16 at 21:09

Guilherme Ferreira

2,209
21
23

How do I retrieve a value from an object using users' inputs? (Angularjs)

2 Answers2