如何在重复之外访问模型值?

问题描述 投票:0回答:2

我有一张表在每个<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>
angularjs angularjs-ng-repeat angularjs-ng-model
2个回答
0
投票

如果任何值为null / empty,验证输入和禁用按钮的最简单方法是添加角度表单验证。你需要做的就是用一个表单(如果还没有完成)包围你的代码,并确保它有一个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
投票

可能是范围问题。在没有看到如何定义控制器以及如何在模板内使用指令的情况下,很难确切地说出问题。如果你正在使用ng-repeat,它会将范围隔离到它所环绕的任何内容。

ng-repeat='data in datas'

只会在该元素/指令的上下文中提供数据。如果您需要其他可用变量,则需要

ng-repeat='data in datas' other-variable='anotherVarYouNeed'
© www.soinside.com 2019 - 2024. All rights reserved.