在加载时从控制器初始化所有 ng-model Angularjs

Question

我遇到了一个问题，我想得到所有声明为 ng-model="a['keyX'] 和 initialize[= 的 ng-models 45=] 他们到 0 在用户开始输入之前..

由于某些原因我无法使用 ng-value。

我试图将 $scope.a 放入我的 initializeToZero() 函数中。它 returns 一个空的 json 对象。

我什至尝试使用 $scope.$apply() 但我的运气不好。

我得到的只是一个空的 json 对象。

有什么方法可以在控制器中将它们全部初始化，而不管输入和键的数量如何？

键的名称会完全不同...我只是在此处提供了通用键名称...因此请确保您没有对其进行硬编码。

我在代码段中提到了 ng-controller，但我使用的是 ui.router

angular.module('myApp', []) .controller('myCtrl', function($scope) { initializeToZero(); function initializeToZero() { if (!$scope.$$phase) { $scope.$apply(); console.log($scope.a); } else { setTimeout(initializeToZero, 1000); } } });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp" ng-controller="myCtrl" ng-init="a = {}"> <input type="number" ng-model="a['key1']"> <input type="number" ng-model="a['key2']"> <input type="number" ng-model="a['key3']"> <input type="number" ng-model="a['key4']"> <input type="number" ng-model="a['key5']"> <input type="number" ng-model="a['key6']"> <input type="number" ng-model="a['key7']"> <input type="number" ng-model="a['key8']"> </div>

Answer 1

首先，最好使用 a.key1 而不是 a['key1']。其次，如果你想为所有 a 值分配零，那么在你的控制器的开头使用 map 函数：

$scope.a.map(函数(项目) { return '0'; });

这将 return 所有项目设置为零。

Answer 2

你应该先定义函数initializeToZero

js:

angular.module('myApp', [])
  .controller('myCtrl', function($scope, $parse) {

    $scope.a = {};

    $scope.initializeToZero = function() {
     var temp = "key";
     for(var i = 0; i < 8; i++){
     var count = i + 1;
     var model = temp + count;
     var result = $parse(model);
     result.assign($scope.a, 0);
     console.log($scope.a);
 } 
}   

      $scope.initializeToZero();         

  });

html:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <input type="number" ng-model="a.key1">
  <input type="number" ng-model="a.key2">
  <input type="number" ng-model="a.key3">
  <input type="number" ng-model="a.key4">
  <input type="number" ng-model="a.key5">
  <input type="number" ng-model="a.key6">
  <input type="number" ng-model="a.key7">
  <input type="number" ng-model="a.key8">


</div>

Answer 3

编辑：有点古怪，但我想它会完成工作。

HTML:

<div ng-app="myApp" ng-controller="myCtrl">
  <input type="number" ng-model="a['key1']">
  <input type="number" ng-model="a['key2']">
  <input type="number" ng-model="a['key3']">
  <input type="number" ng-model="a['some']">
  <input type="number" ng-model="a['other']">
  <input type="number" ng-model="a['keys']">
</div>

JS:

angular.module('myApp', [])
.controller('myCtrl', function($scope) {
  var inputs = document.getElementsByTagName('input');
  $scope.a = {};
  for (var i=0; i<inputs.length; i++) {
    $scope.a[inputs[i].getAttribute('ng-model').replace(/^a\[\'(.*)\'\]$/, '')] = 0;
  }
});

jsFiddle

Answer 4

您需要确保在显示输入字段之前已加载数据：

HTML:
<div ng-app="myApp" ng-controller="myCtrl" data-ng-init="getValues()">
 <div ng-show="dataLoaded">
  <input type="number" ng-model="a['key1']">
  <input type="number" ng-model="a['key2']">
  <input type="number" ng-model="a['key3']">
  <input type="number" ng-model="a['key4']">
  <input type="number" ng-model="a['key5']">
  <input type="number" ng-model="a['key6']">
  <input type="number" ng-model="a['key7']">
  <input type="number" ng-model="a['key8']">
 </div>
</div>


IN YOUR CONTROLLER:
$scope.getValues= function () {
 // Do your initialization here
 // For example:
 angular.forEach($scope.a, function(key, value){
  $scope.a[key] = 0;
 })
 // Set dataLoaded to true
 $scope.dataLoaded = true;
}

编码：http://codepen.io/giannidk/pen/KrmgNL?editors=1011

Answer 5

终于破解了...必须完成一些肮脏的编码..但是没关系..这是代码..

function application(){
        $('input[ng-model^="a"]').each(function(){
            $(this).val(0);
        }); 
}

$scope.initializeToZero = function(){
    console.log("Called initializeToZero");
    if(!$scope.$$phase)
    {
        $scope.$apply(application);
        console.log("Applied");
    }
    else{
        console.log("REDOING");
        setTimeout($scope.initializeToZero,1000);
    }

}    
$scope.initializeToZero();

在加载时从控制器初始化所有 ng-model Angularjs

Initializing all ng-model from controller on load Angularjs

javascript

json

angularjs

angularjs-scope

angular-ngmodel