19473


ネットで調べたものの、ng-repeat で生成されたDom?のvalue値を ng-repeat
スコープ外で使う方法が見つからず。まず根本的に出来るのかもわからず困っています。

sampleAJS.html  

[code]

    <ons-list class="list">
    
      <ons-list-item ng-repeat="product in history track by $index" class="list__item">
          <select class="num" ng-model="countNumber" ng-options="c.value as c.name for c in countList"></select>
          //このローカルスコープ内で動的に変更した value 値を元に計算しGlobalに代入したい
      </ons-list-item>
    
    </ons-list>
    
[/code]

sampleAJS.js

[code]

    $scope.countList = [
        {"value" : 1, "name" : "1"},
        {"value" : 2, "name" : "2"},
        {"value" : 3, "name" : "3"},
        {"value" : 4, "name" : "4"},
        {"value" : 5, "name" : "5"}
    ];
    $scope.countNumber = $scope.countList[0].value;//1
    
[/code]

具体的にJSで説明すると、こんな感じです。

JSsample.html

[code]

      <select class="num0">
        <option value="1" name="1">1</option>
        <option value="2" name="1">2</option>
        <option value="3" name="1">3</option>
        <option value="4" name="1">4</option>
        <option value="5" name="1">5</option>
      </select>
    
      <select class="num1">
        <option value="1" name="1">1</option>
        <option value="2" name="1">2</option>
        <option value="3" name="1">3</option>
        <option value="4" name="1">4</option>
        <option value="5" name="1">5</option>
      </select>
    
      <button id="check">checkButton</button>//anglarではクリックイベント無しで呼べたら嬉しい
    
[/code]

JSsample.js

[code]

    $(function(){
      var g_score = [];
      var $button = $('#check');
      var len = $('select').length;
    
      $button.click(function(){
        for(var i = 0; i < len; i++) {
          g_score[i] = $('.num' + i).val();
          console.log(g_score[i]);
        }
      })
    
    });
    
[/code]


CC BY-SA 3.0
2015-11-17T05:36:25.613
18934
2015-11-30T10:36:13.343
2015-11-30T06:53:48.253
13290
13290
question
monaca angularjs
ng-repeat で生成されたDom?のvalue値を ng-repeat スコープ外で使う方法


色々調べたものの、解決方法は出てこず、考え方自体間違っていたのかな？

ng-repeat 内は $index で連番ふれるので、idに連番ふってイベントで値取得、  
総数はクラスふって取得、最後forで回す。  
というごり押しで対応。

anglar活かしてなくて、全然スマートじゃないのが残念。


CC BY-SA 3.0
2015-11-23T14:52:19.437
19215
2015-11-30T06:43:21.250
2015-11-30T06:43:21.250
13290
13290
18934
answer


あえてグローバル変数に入れる理由は無いような気がしますが、コントローラの中で行った計算結果を`$window`や`$rootScope`のプロパティとして代入するのが一つの方法だと思います。

[code]

    angular.module('app', ['onsen'])
    .controller('PageController', function($scope, $window){
      $scope.sum = 0;
      $scope.history = ['product1', 'product2', 'product3'];
      $scope.countOptions = [1,2,3,4,5];
      $scope.models = [];
      $scope.checkSum = function(){
        var sum = $scope.models.reduce(function(sum, current){
          return sum + current;
        }, 0);
        $scope.sum = sum;
        $window.sum = sum;
      };
    });
[/code]

[code]

    <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.13/build/css/onsen-css-components.css" rel="stylesheet"/>
    <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.13/build/css/onsenui.css" rel="stylesheet"/>
    <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.13/build/js/angular/angular.min.js"></script>
    <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.13/build/js/onsenui.min.js"></script>
    
    <body ng-app="app" ng-controller="PageController">
      <ons-list>
        <ons-list-item ng-repeat="product in history">
          {{product}}
          <select ng-model="models[$index]" ng-options="n as n for n in countOptions"></select>
        </ons-list-item>
      </ons-list>
    
      <button ng-click="checkSum()">Check</button>
      <span class="sum">{{sum}}</span>
    </body>
[/code]


CC BY-SA 3.0
2015-11-30T10:36:13.343
19473
2015-11-30T10:36:13.343
8532
18934
answer