欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

AngularJS實現(xiàn)單獨作用域內(nèi)的數(shù)據(jù)操作

 更新時間:2016年09月05日 11:49:23   作者:MakingChoice  
這篇文章給大家介紹了利用AngularJs如何實現(xiàn)ng-repeat內(nèi)各個小的子作用域單獨數(shù)據(jù)綁定。有需要的小伙伴們可以參考借鑒,下面來一起看看吧。

照例先看效果

下面是這個例子的代碼:

<!DOCTYPE html>
<html lang="en" ng-app="scApp">
<head>
  <meta charset="UTF-8">
  <title></title>
  <script src="lib/angular.min.js" type="text/javascript"></script>
</head>
<body ng-controller="scController">
  <div>
    <div ng-repeat="con in content">
      <input type="text" ng-model="con.num1" ng-change="changeNum1(con)"/>
      <input type="text" ng-model="num2" value="con.num2"/>
      <input type="text" ng-model="con.total" ng-change="changeTotal(con)"/>
    </div>
  </div>
</body>
<script>
  var app=angular.module("scApp",[])
      .controller("scController",["$scope", function ($scope) {
        $scope.num2=2;
        $scope.content=[
          {
            num1:1,
            num2:3,
            total:3,
          },
          {
            num1:2,
            num2:3,
            total:6,
          },
          {
            num1:1,
            num2:6,
            total:6,
          }
        ];
        $scope.changeNum1= function (con) {
          con.total=con.num1*con.num2;
        };
        $scope.changeTotal= function (con) {
          con.num1=con.total/con.num2;
        }
}])
</script>
</html>

總結(jié)

其實方法非常簡單,只需要在每個ng-repeat中傳入具體的每一個數(shù)據(jù)分組就可以實現(xiàn),例如本例子中的ng-change="changeNum1(con)"<code/>這樣就實現(xiàn)了單獨的小的數(shù)據(jù)作用域的控制。

以上就是這篇文章的全部內(nèi)容,希望對大家學(xué)習(xí)或使用AngularJS能有所幫助,如果有疑問可以留言交流。

相關(guān)文章

最新評論