AngularJS scope return $$state

Multi tool use
AngularJS scope return $$state
I have a directive and in this directive I have a value that comes from my controller, here is my directive:
angular
.module('thermofluor')
.directive('tablePlate', tablePlate)
tablePlate.$inject = ['$timeout', '$q'];
function tablePlate($timeout, $q) {
var directive = {
link: link,
restrict: 'E',
templateUrl: '/crims/thermofluor/experiments/table_plate.html',
scope: {
plate: '='
}
};
return directive;
function link(scope, element) {
console.log("test");
var plate = scope.plate;
console.log(plate);
scope.letters = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'];
scope.numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
experiments = ;
experiments[scope.plate.experiment.well] = [scope.plate.experiment];
return;
}
}
The problem is that when I console.log
the scope I see my plate object with everything I need inside, but when I try to console.log
the scope.plate
object, the object change and it return me a $$state
, and I don't know how to use this $$state
console.log
console.log
scope.plate
$$state
$$state
Anyone have an idea ?
scope.plate.then(function(res){ console.log(res) })
Is there any other solution more simple ? I'll need to access to my variable so much times
– Jessy
Jul 2 at 8:57
Promises are asynchronous callbacks, you don't know when the data will arrive: in just a few milliseconds, or in a minute. So you can't really assign the value to a variable (only a Promise). So you have to resolve it every single time. There is a hack, however, where you can assign it to a variable within
angular.config
in your routes (ngRoute
or ui.router
) through resolve property.– Aleksey Solovey
Jul 2 at 9:01
angular.config
ngRoute
ui.router
Is this a good or bad way to put all my code inside the scope.plate.then(function(res){} ? With this method sometimes when I refresh the page is says cannot read property then of undefined, and when I refresh again it works
– Jessy
Jul 2 at 9:01
keeping everything in
.then
is the way to go. If you have more than one promise to deal with, you need to chain them. (There are some ways you can avoid Pyramid callback hell by stacking .then().then()
) Also if you have promises that you need to resolve at the same time without chaining, you can use $q.all()
(it works similarly to Promise.all()
)– Aleksey Solovey
Jul 2 at 9:12
.then
.then().then()
$q.all()
Promise.all()
1 Answer
1
//use of the controller with scope will resolve your problem
angular
.module('thermofluor')
.directive('tablePlate', tablePlate)
tablePlate.$inject = ['$timeout', '$q'];
function tablePlate($timeout, $q) {
var directive = {
link: link,
restrict: 'E',
controller: ['$scope',function($scope){
console.log("test");
var plate = $scope.plate;
console.log(plate);
$scope.letters = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'];
$scope.numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
experiments = ;
experiments[$scope.plate.experiment.well] = [$scope.plate.experiment];
}],
templateUrl: '/crims/thermofluor/experiments/table_plate.html',
scope: {
plate: '='
}
};
return directive;
function link(scope, element) {
return;
}
}
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
the scope that you are printing is an AngularJS Promise. You can resolve it with
scope.plate.then(function(res){ console.log(res) })
– Aleksey Solovey
Jul 2 at 8:56