Que tal verán soy nuevo en angularjs y tengo un problema al intentar hacer un que un scope sea dinámico, mi código original y que si funciona es el siguiente
var app = angular.module("telApp")
.controller("PromoDevicesController",
['$window','$scope','$attrs','$http','$cookies', function($window, $scope, $attrs, $http, $cookies) {
if ($attrs.devices != "") {
var dataAttribute = JSON.parse($attrs.devices);
if (dataAttribute[0] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[0]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device0 = jsonData.data[0];
$scope.$apply();
});
} else {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device0 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[1] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[1]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device1 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[2] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[2]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device2 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[3] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[3]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device3 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[4] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[4]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device4 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[5] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[5]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device5 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[6] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[6]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device6 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[7] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[7]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device7 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[8] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[8]+'.json';
console.log(""+dataAttribute[8]);
$.getJSON(jsonData, function (jsonData) {
$scope.device8 = jsonData.data[0];
$scope.$apply();
});
}
if (dataAttribute[9] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[9]+'.json';
console.log(""+dataAttribute[9]);
$.getJSON(jsonData, function (jsonData) {
$scope.device9 = jsonData.data[0];
$scope.$apply();
});
}
}
}]);
Como verán el código se repite mucho en cada if y el problema es que solo obtiene 10 atributos por lo cual lo quiero hacer dinamico y en vez de pasarlo por condicionales pasarlo por un while de la siguiente forma,
var app = angular.module("telApp")
.controller("PromotionDevicesController", ['$window','$scope','$attrs','$http','$cookies', function($window, $scope, $attrs, $http, $cookies) {
if ($attrs.devices != "") {
var dataAttribute = JSON.parse($attrs.devices);
if (dataAttribute[0] != null) {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[0]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device0 = jsonData.data[0];
$scope.$apply();
});
} else {
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope.device0 = jsonData.data[0];
$scope.$apply();
});
}
var index = 1;
while(dataAttribute[index] != null){
var jsonData = '/bin/device/filter.filterAllDataDevice.'+dataAttribute[index]+'.json';
$.getJSON(jsonData, function (jsonData) {
$scope['device' + index] = jsonData.data[0];
$scope.$apply();
});
index++;
}
}
}]);
sin embargo no funciona me podrían ayudar
Como tal no me arrija ningún error pero a la hora de debugear todo viene como undefined, es decir si hago un
console.log($scope.device1)
Este viene como undefined tambien si coloco breackpoint en var jsonData (cabe aclarar que si esta recibiendo los datos del servicio REST)
Sin embargo funciona bien si coloco un
console.log($scope['device' + index])
Puedo observar que el console.log si me envia los datos correctamente
Ahora el problema es que en el HTML nunca los muestra tratando de acceder a la variable
{{ device1.marca.nombre }}
Aclaro que todo funcionaba cuando estaba dde manera estatica limitado a 10 device
sin embargo ahora que hice que el $scope fuera de manera dinamica dentro de un while esto deja de funcionar
se supone que
var index = 1;
$scope['device' + index] = "foo"
es igual a
$scope.device1 = "foo"
"No se si halla otra forma de obtener variables del tipo $scope['device' + index] desde el html como les dije soy nuevo en angularjs"
index
en la función:$.getJSON(jsonData, function (jsonData, index) { $scope['device' + index] = jsonData.data[0]; $scope.$apply(); });