Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise

I'm new to angularjs, I have two text boxes and a button. First textbox is to fill with age(15 to 66 - numbers only). Second textbox is to fill with term in "nine" / "twelve" / "fifteen" in string only. (else radio buttons is also ok in place of second textbox but i have no idea how to implement this with my problem.). after entering two fields click on button i have to get:

term data with entered age and with "nine" / "twelve" / "fifteen" json data only.

"Age: 44 and Term: 785.5"

ex: In first textbox I have entered "44" as age, and in second textbox I have entered "twelve" (or else I have selected "12" in radio button), and click on button i have to get the value as "Age: 44 and Term: 785.5"

WORKING FIDDLE

I have no idea how to dynamically change "ng-bind='pa.term.twelve'" this value(twelve value):

<ul>
   <li ng-repeat="pa in T816 | filter:getAge">
      <p>
         Term 12 Data: <b data-ng-bind="pa.term.twelve"></b>
      </p>
   </li>
</ul>

any help is appreciated.

share|improve this question
    
I looked into the fiddle,it seems to work fine. "pa.term.twelve" is the data from T816 array,how you exactly want to dynamically change.i dont get it. – Ritesh Apr 29 '15 at 9:04
    
actually i need to enter twelve or fifteen or nine into text box and in html part twelve should not be there.. data-ng-bind="pa.term" – UiUx Apr 29 '15 at 9:06
    
so in the html part where you have hard-coded 12,there you want what you type in text box,correct me if i am wrong – Ritesh Apr 29 '15 at 9:08
    
yeah you got it . – UiUx Apr 29 '15 at 9:14
    
jsfiddle.net/x5m0f8g3/5 Try this fiidle – Ritesh Apr 29 '15 at 9:18
up vote 1 down vote accepted

Not the best way to do it, but you can try with this kind of expressions:

<p ng-if="getTerm === 'nine'">Term 9 Data: <b data-ng-bind="pa.term.nine" ></b></p>
<p ng-if="getTerm === 'twelve'">Term 12 Data: <b data-ng-bind="pa.term.twelve"></b></p>
<p ng-if="getTerm === 'fifteen'">Term 15 Data: <b data-ng-bind="pa.term.fifteen"></b></p>

using ng-if will render only the p with the getTerm selected.

I updated your fiddle reflecting the given solution.

share|improve this answer
    
thats that works as expected and how to change in such cases: fiddle – UiUx Apr 29 '15 at 9:12
    
You are holding the radio button value inside ng-model="value", so just change getTerm with value or wathever you define as the model fiddle – Daniele Apr 29 '15 at 9:15
    
thank you @Daniele that works great. – UiUx Apr 29 '15 at 9:18

You can place 3 block of data with ng-if condition, like the following:

<p>Term 12 Data: <b ng-if="getTerm=='nine'" data-ng-bind="pa.term.nine"></b>
                 <b ng-if="getTerm=='twelve'" data-ng-bind="pa.term.twelve"></b>
                 <b ng-if="getTerm=='fifteen'" data-ng-bind="pa.term.fifteen"></b>
</p>

Or you may create function that will return correct value. In your example you need just to display correct value and you have no need to update it, so function is ok:

<p>Term 12 Data: <b>{{getTermValue(pa.term)}}</b></p>

and function:

$scope.getTermValue=function (term){
            switch ($scope.getTerm)
            {
                    case "nine": return term.nine;
                    case "twelve": return term.twelve;
                    case "fifteen": return term.fifteen;
            }
            return "";
        }

Function is better if number of properties may increase.

share|improve this answer
    
thank you @pavel for your time. it works gr8 – UiUx Apr 29 '15 at 9:19

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.