How to access ng-model values outside of ng-repeat?

Question

I have a table that is filled with <input> fields in every <td>, that are repeating in ng-repeat. In some cases some of the inputs may came with null value. I want to access the ng-model value, to detect when the user changes the value of ng-model in !=null to enable a button to process data in server. That is the code in ng-repeat:

<tbody>
    <tr ng-repeat="data in resultValue=(vm.ExcelDataDialog) | filter: FilterNullData" class="fade">
        <td style="min-width: 2px !important;width:2px !important">{{$index + 1}}</td>
        <td>
         <input type="text" ng-model="data.Pershkrimi" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.Pershkrimi != null, input_red: data.Pershkrimi == null}" />
        </td>
        <td>
         <input type="text" ng-model="data.Klienti" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.Klienti != null, input_red: data.Klienti == null}" />
        </td>
        <td>
        <input type="text" ng-model="data.KodiArtikullit" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.KodiArtikullit != null, input_red: data.KodiArtikullit == null}" />
         </td>
         <td>
         <input type="number" ng-model="data.Sasia" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.Sasia != null, input_red: data.Sasia == null}" />
         </td>
         <td>
         <input type="number" ng-model="data.Cmimi" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.Cmimi != null, input_red: data.Cmimi == null}" />
         </td>
          <td>
          <input type="text" ng-model="data.DateFillimi" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.DateFillimi != null, input_red: data.DateFillimi == null}" />
          </td>
           <td>
           <input type="text" ng-model="data.DateMbarimi" ng-model-options="{ 'updateOn': 'blur' }" ng-class="{validate_for_creating_new_ofer: data.DateMbarimi != null, input_red: data.DateMbarimi == null}" />
           </td>
    </tr>
</tbody>

I check if data are null in controller, but I want to check when they are filed in the view to enable the button. There is the button code:

 <md-button type="submit" id="create_offer"
            ng-click="vm.AddOfferByImportingExcel()"
            class="send-button md-accent md-raised"
            aria-label="krijo_oferte" 
            ng-disabled = "data.Pershkrimi == null">
   Krijo ofertë
 </md-button>

Answer 1

The easiest way to validate your inputs and disable the button if any value is null / empty is to add angular form validation. All you need to do is surround your code with a form (if not already done) and make sure it has a name. Then add ng-required="true" to each of your inputs you want required. Then you can access formName.$invalid to determine if the form is valid or not.

<form name="formName">

    <tbody>
        <tr ng-repeat="data in resultValue=(vm.ExcelDataDialog) | filter: FilterNullData" class="fade">
            <td style="min-width: 2px !important;width:2px !important">{{$index + 1}}</td>
            <td>
                <input type="text" ng-model="data.Pershkrimi" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.Pershkrimi != null, input_red: data.Pershkrimi == null}" />
            </td>
            <td>
                <input type="text" ng-model="data.Klienti" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.Klienti != null, input_red: data.Klienti == null}" />
            </td>
            <td>
                <input type="text" ng-model="data.KodiArtikullit" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.KodiArtikullit != null, input_red: data.KodiArtikullit == null}" />
            </td>
            <td>
                <input type="number" ng-model="data.Sasia" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.Sasia != null, input_red: data.Sasia == null}" />
            </td>
            <td>
                <input type="number" ng-model="data.Cmimi" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.Cmimi != null, input_red: data.Cmimi == null}" />
            </td>
            <td>
                <input type="text" ng-model="data.DateFillimi" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.DateFillimi != null, input_red: data.DateFillimi == null}" />
            </td>
            <td>
                <input type="text" ng-model="data.DateMbarimi" ng-model-options="{ 'updateOn': 'blur' }" ng-required="true" ng-class="{validate_for_creating_new_ofer: data.DateMbarimi != null, input_red: data.DateMbarimi == null}" />
            </td>
        </tr>
    </tbody>

    <md-button type="submit" id="create_offer"
        ng-click="vm.AddOfferByImportingExcel()"
        class="send-button md-accent md-raised"
        aria-label="krijo_oferte" 
        ng-disabled = "formName.$invalid">
        Krijo ofertë
    </md-button>

</form>