javascript - $BROADCASTing from service to controller -


i have little concern here

this comes service named betslipfactory

  removeslip: function(slip) {      return betslipselectionrequest('/betslip/removeselection', {       game: slip.game,       pair: slip.pair,       line: slip.line     });   }

then have function in controller service

$scope.removeslip = function(slip) {    $rootscope.$broadcast('betslip:removelines', slip);   betslipfactory.removeslip(slip)  }

next have controller in different scope named linesctrl , have function here calls couple functions service betslipfactory kind of toggle function

$rootscope.$on('betslip:removelines', function(event, slip) {   if (slip) {     betslipfactory.remove(line, row, type);   }; });  $scope.addlinetobetslip = function(line, row, type) {   var spreadselected = (row.spreadselected && type === 'spread'),     totalselected = (row.totalselected && type === 'total'),     moneylineselected = (row.moneylineselected && type === 'moneyline');   if (spreadselected || totalselected || moneylineselected) {      betslipfactory.remove(line, row, type);    }else {      betslipfactory.add(line, row, type);    } };

and html:

     <button ng-click="removeslip(slip)"></button>

and:

     <td ng-class="!row.moneylineselected ? 'lines-hover' : 'line-selected'">         <a ng-click="addlinetobetslip(line, row, 'moneyline')">            <span ng-hide="row.nomoneyline">{{:: row.moneyline}}</span>         </a>      </td>

what need: combine scopes, when function $scope.removeslip(slip) call, need call $scope.addlinetobetslip(line, row, type) , function should call betslipfactory.remove(line, row, type); within if statement.

when call $scope.removeslip(slip) need kill slip parameter, within scope of betslipfactory works great.

i recorded video see talking about, let me explain video little bit.

in first 2 tries might see able select , deselect , works great, in 3rd , 4th try, see select line, , go call , removeslip(slip) when play x on right, , in order deselect line on left have manually.

so started fiddle showing process dumbed way down compared plnkr started after. here using 2 separate controllers , service (factory) manage data. can done without using $rootscope or $broadcast. can take have done here , integrate code posted on plnkr. below can see quite simple process

the jsfiddle

html:

<div ng-app="testapp">     <div id="colleft" ng-controller="leftcontroller">         <div ng-repeat="bet in possiblebets">             <button ng-class="!bet.moneylineselected ? 'lines-hover' : 'line-selected'" ng-click="addlinetobetslip(bet)">{{bet.name}}</button>         </div>     </div>     <div id="colright" ng-controller="rightcontroller">         bets:<br>         <div ng-repeat="bet in bets">             active bet: {{bet.name}} - <button ng-click="removelinefrombetslip(bet)">&times;</button>         </div>     </div> </div>

css: 

.lines-hover {  }  .line-selected {     background:yellow; }  #colleft {     width:65%;     background:#f00;     float:left; }  #colright {     width:35%;     background:gray;     float:left; }

and js

var app = angular.module('testapp',[]);  app.controller('leftcontroller', function($scope, betslipfactory) {     // data data db     $scope.possiblebets = [         {name:'bet 1',moneylineselected:false},         {name:'bet 2',moneylineselected:false},         {name:'bet 3',moneylineselected:false}     ];      // think it, addlinetobetslip not name     // since toggles bet     $scope.addlinetobetslip = function(bet)     {         bet.moneylineselected = !bet.moneylineselected; // toggle moneylineselected boolean         (bet.moneylineselected) ? betslipfactory.add(bet) : betslipfactory.remove(bet); // add or remove bet     }; });  app.controller('rightcontroller', function($scope, betslipfactory) {     $scope.bets = betslipfactory.getallbets(); // link active bets      // remove bet factory     $scope.removelinefrombetslip = function(bet)     {         bet.moneylineselected = false;         betslipfactory.remove(bet);     }; });  app.service('betslipfactory', function() {     //a place keep active bets     var thebets = [];     return {         add: function(bet)         {             // add bet local array             thebets.push(bet);         },         remove: function(bet)         {             // should error checking of index before removing             var index = thebets.indexof(bet);             thebets.splice(index,1);         },         getallbets: function()         {             //simply return active bets             return thebets;         }     } });  function log(msg) {     console.log(msg); }

Comments

Post a Comment

Popular posts from this blog

java - Spring Data JPA: Why findOne(id) executing delete query internally? -

i have 1 application using @manytomany annotation link 2 different entities 1 parent entity. not sure if have implemented properly. when execute .findone() on parent entity's repository find it, @ first fetch data along executing delete queries internally delete record mapping table (a table jpa creates after adding @manytomany annotation.). following generated sql queries , code snippet: java class @entity @table(name = "inventory") public class inventory { @id long id; // many other properties @manytomany(fetch=fetchtype.lazy) private list<stream> streams; @manytomany(fetch=fetchtype.lazy) private list<subject> subjects; } there no other annotation i've put in stream , subject entity class link inventory class. when run app, create following tables: inventory stream subject inventory_stream inventory_subject (inventory_stream , inventory_subject, 2 tables created automatically, don't k...
Read more

python - Mongodb How to add addtional information when aggregating? -

i beginner , wrote line pipeline works, wanna add other information output, screen name , or number of tweets.i tried add under $group gave me syntax error everytime here pipeline: def make_pipeline(): # complete aggregation pipeline pipeline = [ { '$match': { "user.statuses_count": {"$gt":99 }, "user.time_zone": "brasilia" } }, { "$group": { "_id": "$user.id", "followers": { "$max": "$user.followers_count" } } }, { "$sort": { "followers": -1 } }, { "$limit" : 1 } ]; i using on example : { "_id" : objectid("5304e2e3cc9e684aa98bef97"), "text" : "first week of school on :p", "in_reply_to_status_id" : null, "retweet_count" : null, ...
Read more

java - Incorrect order of records in M-M relationship in hibernate -

Image
i have 4 records in bridge table in mysql database. using @manytomany in hibernate, accurate order of employees incorrect incorrect of projects. following required material figure out doing mistake. this source. @entity @table(name="project") public class projectbean { @id @generatedvalue @column(name="project_id") private int projectid; @column(name="title") private string projecttitle; @manytomany(mappedby="projects") private collection<employeebean> employees; public projectbean() { employees = new arraylist<employeebean>(); } //getters & setters } @entity @table(name="employee") public class employeebean { @id @generatedvalue @column(name="employee_id") private int employee_id; @column(name="first_name") private string ...
Read more