Как получить доступ к значениям ng-модели вне ng-repeat? - PullRequest
Новая
       36

Как получить доступ к значениям ng-модели вне ng-repeat?

0 голосов
/ 13 февраля 2019

У меня есть таблица, заполненная полями <input> в каждом <td>, которые повторяются в ng-repeat.В некоторых случаях некоторые из входов могут иметь значение null.Я хочу получить доступ к значению ng-model, чтобы определить, когда пользователь изменяет значение ng-model в !=null, чтобы позволить кнопке обрабатывать данные на сервере.Это код в 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>

Я проверяю, являются ли данные нулевыми в контроллере, но я хочу проверить, когда они представлены в представлении, чтобы включить кнопку.Есть код кнопки: 

 <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>

Ответы [ 2 ]

0 голосов
/ 13 февраля 2019

Самый простой способ проверить ваши входные данные и отключить кнопку, если любое значение равно нулю / пусто, - добавить угловую проверку формы.Все, что вам нужно сделать, это окружить ваш код формой (если это еще не сделано) и убедиться, что он имеет name.Затем добавьте ng-required="true" к каждому из ваших входов, которые вы хотите получить.Затем вы можете получить доступ к formName.$invalid, чтобы определить, является ли форма действительной или нет. 

<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>
0 голосов
/ 13 февраля 2019

Может быть проблема с областью.Не видя, как определяется контроллер и как директива используется внутри шаблона, трудно точно определить проблему.Если вы используете ng-repeat, он изолирует область видимости от того, над чем он зацикливается. 

ng-repeat='data in datas'

только сделает данные доступными в контексте этого элемента / директивы.Если вам нужны другие переменные, вам нужно 

ng-repeat='data in datas' other-variable='anotherVarYouNeed'
...