0
J'ai des cartes de joueur de cricket où un utilisateur peut choisir 11 sur un possible 30, avoir dans 2 pour atm de test, le problème est, je suis en train de sélectionner les joueurs dans un enfant scope qui les ajoute à un tableau déclaré dans la portée parent. Ensuite, ce même tableau est mappé à une portée enfant différente, mais les valeurs ne sont pas transmises. Code ci-dessous, toute aide serait géniale. À votre santé!!Enfant portée à Parent Portée à portée différente de l'enfant
var page = '<div class="section cricket">' +
'<div class="input-frame " focus-after-error fill-panel>' +
'<p>Your Choices</p>' +
'<div class="chosen-cards" data-cards-chosen="chosenPlayers" data-chosen-cards>' +
'</div>' +
'</div>' +
'<div class="input-frame" focus-after-error fill-panel>' +
'<fieldset class="cricket-inputs" id="custom-checkbox" data-error-message="There is an error" data-required="true" data-cards="" data-player-cards="players">' +
'</fieldset>' +
'</div>' +
'</div>';
var card = '<div class="card" ng-repeat="playerCard in playerCards" data-choose-card="" data-name=" {{playerCard.name}}" data-img="{{playerCard.img}}">' +
'<div class="player" >' +
'<img src="images/{{playerCard.img}}">' +
'<div class="inner-overlay"></div>' +
'</div>' +
'<p>{{playerCard.name}}</p>' +
'</div>';
(function() {
'use strict';
// --------------------------------------------------------------------------
// Cricket Page
// --------------------------------------------------------------------------
angular.module('eform').directive('cricket', ['$timeout', function ($timeout) {
return {
restrict: 'A',
template: page,
scope: true,
controller: function($scope){
},
link: function($scope, $element){
$scope.players = [
{name: 'George Baily', img: 'Bailey.png'},
{name: 'Micheal Clarke', img: 'Clarke.png'}
];
$scope.chosenPlayers = [];
$timeout(function(){
$element = $element.find('.card');
$element.on('click', function(){
var $this = $(this);
if($this.hasClass('chosen')){
$this.removeClass('chosen').removeClass('active');
} else {
$this.addClass('chosen');
$scope.chosenPlayers.push({name : $this.attr('data-name'), img : $this.attr('data-img')});
}
});
$($element[0]).hover(function() {
var $this = $(this);
$this.addClass('active');
}, function() {
var $this = $(this);
$this.removeClass('active');
});
});
}
};
}]);
})();
(function() {
'use strict';
// --------------------------------------------------------------------------
// Cricket card
// --------------------------------------------------------------------------
angular.module('eform').directive('cards', [ function() {
return {
restrict: 'A',
template: card,
scope : {
playerCards : '=playerCards'
}
};
}]);
})();
(function() {
'use strict';
// --------------------------------------------------------------------------
// Cricket card
// --------------------------------------------------------------------------
angular.module('eform').directive('chosenCards', [ function() {
return {
restrict: 'A',
template: card,
scope : {
playerCards : '=cardsChosen'
}
};
}]);
})();