angularjssteroids

Getting selected values in Angular


I've got the following HTML (building hybrid app using steroids):

<select>
    <option value="1">Once a day</option>
    <option value="2">Once a week</option>
</select>

<li class="item item-checkbox">
  <label class="checkbox">
    <input type="checkbox" value="resumes">
  </label>
  Resumes
</li>
<li class="item item-checkbox">
  <label class="checkbox">
    <input type="checkbox" value="linkedin">
  </label>
  LinkedIn
</li>
<li class="item item-checkbox">
  <label class="checkbox">
    <input type="checkbox" value="mycco">
  </label>
  myCCO
</li>

Is there a way in Angular to get the selected value from the select and all of the selected checkboxes?


Solution

  • Sure just add ng-model to each

    <select ng-model="data.period">
        <option value="1">Once a day</option>
        <option value="2">Once a week</option>
    </select>
    
    <li class="item item-checkbox">
      <label class="checkbox">
        <input  ng-model="data.resumes" type="checkbox" value="resumes">
      </label>
      Resumes
    </li>
    <li class="item item-checkbox">
      <label class="checkbox">
        <input  ng-model="data.linkedin" type="checkbox" value="linkedin">
      </label>
      LinkedIn
    </li>
    <li class="item item-checkbox">
      <label class="checkbox">
        <input ng-model="data.mycco"  type="checkbox" value="mycco">
      </label>
      myCCO
    </li>
    

    In your controller:

    // Contains all your data
    $scope.data = {};
    

    However you might consider doing the whole form validation/submit thing such as https://scotch.io/tutorials/angularjs-form-validation