亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

AngularJS 獲取ng-repeat動態(tài)生成的ng-model值實例詳解

 更新時間:2016年11月29日 11:49:32   作者:DoctorQ  
這篇文章主要介紹了AngularJS 獲取ng-repeat動態(tài)生成的ng-model值實例詳解的相關資料,這里提供實例代碼及實現(xiàn)效果圖,需要的朋友可以參考下

AngularJS 獲取ng-repeat動態(tài)生成的ng-model值

              最近做項目遇到了ng-model是ng-repeat動態(tài)生成的,ng-model=”變量”,什么變量,是未知的,所以你無法在$scope."變量"取到值,就算取到值也是其中一個值,這樣的問題,經(jīng)過百度一番查找找到解決方案,這里記錄下,也行可以幫助到大家。

代碼

html

<div>
  <div class="modal-header">
    <h3 class="modal-title">用例集全局參數(shù)配置</h3>
  </div>
  <div class="modal-body">
    <table class="table table-hover">
      <thead>
      <tr>
        <th>參數(shù)</th>
        <th>參數(shù)值</th>
      </tr>
      </thead>
      <tbody ng-repeat="param in params">
      <tr>
        <td>{{param}}</td>
        <td><input name="test" class="form-control" type="text" ng-trim="false" ng-model="$parent.conf[$index]"/></td>
      </tr>
      </tbody>
    </table>


  </div>

  <div class="modal-footer">
    <button class="btn btn-primary" ng-click="ok()">
      應用
    </button>
    <button class="btn btn-warning" ng-click="cancel()">取消</button>
  </div>

</div>

JS

var ModalInstanceCtrl = function ($scope, $modalInstance, params) {
      $scope.params = params;
      $scope.conf = [];
      $scope.ok = function () {
        console.log($scope.conf);
        $modalInstance.close($scope.conf);
      };
      $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
      };
    };

問題描述

因為ng-model是ng-repeat動態(tài)生成的,ng-model=”變量”,什么變量,是未知的,所以你無法在$scope."變量"取到值,就算取到值也是其中一個值,這個問題困擾了我一天,終于解決了。

解決方法

首先ng-model設置為$parent.conf[$index]:

  1. 用$parent的原因是ng-repeat產(chǎn)生的,他會為每一個input生成一個子scope對象,而$parent表示用父類的scope,這樣我們在JS文件中才能取到該值。
  2. $index代表的意思是ng-repeat="param in params"遍歷時的下標
  3. conf是我們在js中的變量名實際效果

我們在controller中定義了一個$scope.conf = [];就是一個數(shù)組,剛好通過上面的代碼,為該數(shù)組添加了元素,然后我們通過scope.conf剛好把ng-model的所有元素自動保存了。

實際效果:

感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!

相關文章

最新評論