[AngularJS] Re: i want to sort data between two dates?
you are sorting the String, convert to Date object first : //return piece return function(records, from, to) { var fromDate = new Date (from ) var toDate = new Date( to ) return records.filter(function(record) { return new Date(record.Date) >= fromDate && new Date(record.Date) <= toDate; }); } On Wednesday, February 3, 2016 at 3:57:04 PM UTC-7, Ali Jatoi wrote: > > var app = angular.module('app',[]).controller('ctrl1', function($scope){ > > $scope.from = '05/02/2015'; > $scope.to = '05/04/2015'; > > $scope.record = [ > {uniqueID : 'pp-12', Name : 'Jim', status : 'Approved', > Date:'05/01/2015',eDate:'05/08/2015' }, > {uniqueID : 'pp-11', Name : 'Jim', status : 'Canceled', > Date:'05/02/2015',eDate:'05/08/2015' }, > {uniqueID : 'pp-45', Name : 'Nick', status : 'Pending', > Date:'05/03/2015',eDate:'05/08/2015' }, > {uniqueID : 'pp-32', Name : 'Thomas', status : > 'Canceled', Date:'05/04/2015',eDate:'05/08/2015' }, > {uniqueID : 'pp-01', Name : 'Thomas', status : 'Pending', > Date:'05/05/2015',eDate:'05/08/2015' }, > {uniqueID : 'pp-09', Name : 'Nick', status : 'Approved', > Date:'05/06/2015',eDate:'05/08/2015' }, > {uniqueID : 'pp-23', Name : 'Lina', status : 'Requested', > Date:'05/07/2015',eDate:'05/08/2015'}, > {uniqueID : 'pp-39', Name : 'Jim', status : 'Pending', > Date:'05/08/2015',eDate:'05/08/2015' } > ]; > }) > > .filter('dateRange', function() { > return function(records, from, to) { > return records.filter(function(record) { > return record.Date >= from && record.Date <= to; > }); > } > }) > when i do this data has been removed? *return record.Date >= from && > record.eDate <= to;* > *i want to sort data between two dates? Help please* > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: New route doesn't allow me inject custom services in a separate file.
Sounds like it's related to these issues with new angular router: https://github.com/angular/router/issues/258 https://github.com/angular/router/issues/192 On Friday, June 12, 2015 at 3:59:41 PM UTC-6, Daniela Meneses wrote: Hi guys, just trying to figure out how can I have services in separate files. My current file hierarchy is this one: https://lh3.googleusercontent.com/-D0NCN1u8hP0/VXtS2kxVZvI/CUQ/jz94Qitnlig/s1600/.PNG Just following the example in the new angular router page. When I try to add a service like this one: angular .module('home') .service('HomeService', [HomeService]); function HomeService() { var homeService = {}; homeService.test = function() { return 'test'; }; } and inject it in the controller like this: angular .module('home') .controller('HomeController', [ 'HomeService', HomeController ]); function HomeController(HomeService) { this.name = 'Friend'; this.test = HomeService.test(); } I just get an error in the console: router.es5.js:384 Could not instantiate controller HomeController If I put the service in the same file as the controller, everything works. angular .module('home') .service('HomeService', [HomeService]) .controller('HomeController', [ 'HomeService', HomeController ]); function HomeService() { var homeService = {}; homeService.test = function() { return 'test'; }; return homeService; } function HomeController(HomeService) { this.name = 'Friend'; this.test = HomeService.test(); } Do you know how can I create the service in a separate file and inject it to different controllers?? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: using $watch within another $watch
Yeah, this is hard to decrypt. You might want to use a plunkr to illustrate. That said... it be easier to have separate watches and a new local variable to know the difference. directive.link = function($scope, element, attributes) { var makepubpriHidden = false; $scope.$watch('flag',function(newVal){ console.log(newVal+newVal); if(newVal==false){ $(.makepubpri).hide(); makepubpriHidden = true; }else{ $(.makepubpri).show(); makepubpriHidden = true; } }) }; $scope.$watch('fflag',function(newValue){ console.log(flag1 value+newValue) if(newValue==202 makepubpriHidden){ $(.hidemain).hide(); console.log(is it coming in 202--) }else{ $(.hidemain).show(); } }) On Friday, June 12, 2015 at 1:08:47 AM UTC-6, Kiran A wrote: i want to hide element based on the flag value. i am not able to hide span class=hidemainEmail IDb:/b {{userprofile.useremail}} /span element even if fflag==202 corp.directive('pubpri',function(){ console.log(is this pubpri is called--); var directive = {}; directive.restrict = 'A'; directive.scope = { flag : '=flag', fflag : '=fflag' } directive.link = function($scope, element, attributes) { $scope.$watch('flag',function(newVal){ console.log(newVal+newVal); if(newVal==false){ $(.makepubpri).hide(); $scope.$watch('fflag',function(newValue){ console.log(flag1 value+newValue) if(newValue==202){ $(.hidemain).hide(); console.log(is it coming in 202--) }else{ $(.hidemain).show(); } }) }else{ $(.makepubpri).show(); } }) }; return directive; }); div pubpri flag=userprofile.result fflag=userprofile.pubpriEmail span class=hidemainEmail IDb:/b {{userprofile.useremail}} /span div class=makepubpri label class=label-radio inline style=padding-left: 850px ! important; input type=radio name=pubpriemail ng-model=userprofile.pubpriEmail value=201 span class=custom-radio/span Public /label label class=label-radio inline input type=radio name=pubpriemail ng-model=userprofile.pubpriEmail value=202 span class=custom-radio/span Private /label /div div -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Clean table construction and DOM-manipulating directives
Yes, your template for a directive can have another directive and you are on the right path to create your data structures such that iterating over them lines-up with angular's ng-repeat in the goal you are looking for. Glad you are seeing a path. Luke On Thu, May 14, 2015 at 4:30 PM, Bartholomew Furrow fur...@gmail.com wrote: Luke, Thanks so much for the response. It looks like the core of your idea is to build the table in the directive. I had a similar approach where I basically built the table entries in a JavaScript array of arrays, then had a simple tr ng-repeattd ng-repeat... sort of thing to display it. If one of the entries had HTML elements in it, they wouldn't render, which I gather is a very reasonable security precaution; but it looks like this approach circumvents that nicely. Thanks for unsticking me! Bartholomew On Thu, May 14, 2015 at 12:34 AM Luke Kende luke.ke...@gmail.com wrote: First of all, I'd work on one directive concept at a time and then build up to complexity as appropriate. Your ng-repeat does not have to be outside the directive but can be in the directive's template, and instead pass in the data to the table's directive. You can then have custom directives in them template of your custom directives. table special-table=all_data_rows group-by={{colour}}/table //this is quick typed to show idea not to be accurate javascript .directive('specialTable', function(){ return { scope: { rows: '=specialTable', groupBy: '@' }, template: 'theadtrth ng-repeat=header in headers{{header}}/th/tr/theadtbodytr ng-repeat=(group, row) in rowstd ng-repeat=(key, value) in row ng-attr-rowspan={{row.count}}{{value}}/td/tr/tbody', link: function(scope, element, attrs) { //using underscore.js to simplify data manipulation scope.headers = _.keys(scope.rows[0]); //group items by colour or whatever you passed in var grouped = _.groupBy(scope.rows, scope.groupBy); } } }) This is not a finished example, but just giving you the approach I would take to see if that gets you thinking. On Wednesday, May 13, 2015 at 6:50:10 PM UTC-6, Bartholomew Furrow wrote: I'd like to use Angular directives to automatically build nice tables for me, and I'm having trouble. I have a bunch of JS objects like this one: {product: 'ProdA', colour: 'Black', team: 'U16B', count: 5}. Here's what I want the table to look like: Team | Product | Count -- U14B | ProdA | 20 |-+-- | ProdB | 20 |-+-- | ProdC | 20 -+-+-- U14G | ProdA | 19 |-+-- | ProdD | 19 ... Notice that colour wasn't in the table, and was aggregated over. The problem is that I have at least four tables like this, and I'm thinking it would be worth my time to make a clean solution. I'm looking for a clean way of doing this, and I'm hoping Angular Directives can help. Here's an example of how I imagine it could work: table class=item_table sort-rows aggregate-identical-rows-in-rightmost-column make-rowspans-for-identical-cells make-alternating-rows-different-colours tr thTeam/th thProduct/th thCount/th /tr tr ng-repeat=row in all_data_rows tdrow.team/td tdrow.product/td tdrow.count/td /tr /table The problem is that when any of the directives in the table tag run, the rows created by the tr ng-repeat... don't exist yet. From this mailing list I see that I could go to the innermost ng-repeat and call a directive that checks for $last at every level, but this seems sketchy and is a really weird place to put those directives. Am I trying to use directives for things they aren't designed for? Is $last really a perfectly good solution, even if I have nested ng-repeats and I have to check for $last all the way out to the table tag? Does anyone have a good way of doing this angularly? I know there are javascript approaches I could take, but once the contents of the cells get more complicated (e.g. buttons), those get messier. This solution just seems so pretty if it would only work. I'd appreciate any thoughts. Thanks, Bartholomew -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/-DuD9KH-sq8/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/-DuD9KH-sq8/unsubscribe
[AngularJS] Re: Clean table construction and DOM-manipulating directives
First of all, I'd work on one directive concept at a time and then build up to complexity as appropriate. Your ng-repeat does not have to be outside the directive but can be in the directive's template, and instead pass in the data to the table's directive. You can then have custom directives in them template of your custom directives. table special-table=all_data_rows group-by={{colour}}/table //this is quick typed to show idea not to be accurate javascript .directive('specialTable', function(){ return { scope: { rows: '=specialTable', groupBy: '@' }, template: 'theadtrth ng-repeat=header in headers{{header}}/th/tr/theadtbodytr ng-repeat=(group, row) in rowstd ng-repeat=(key, value) in row ng-attr-rowspan={{row.count}}{{value}}/td/tr/tbody', link: function(scope, element, attrs) { //using underscore.js to simplify data manipulation scope.headers = _.keys(scope.rows[0]); //group items by colour or whatever you passed in var grouped = _.groupBy(scope.rows, scope.groupBy); } } }) This is not a finished example, but just giving you the approach I would take to see if that gets you thinking. On Wednesday, May 13, 2015 at 6:50:10 PM UTC-6, Bartholomew Furrow wrote: I'd like to use Angular directives to automatically build nice tables for me, and I'm having trouble. I have a bunch of JS objects like this one: {product: 'ProdA', colour: 'Black', team: 'U16B', count: 5}. Here's what I want the table to look like: Team | Product | Count -- U14B | ProdA | 20 |-+-- | ProdB | 20 |-+-- | ProdC | 20 -+-+-- U14G | ProdA | 19 |-+-- | ProdD | 19 ... Notice that colour wasn't in the table, and was aggregated over. The problem is that I have at least four tables like this, and I'm thinking it would be worth my time to make a clean solution. I'm looking for a clean way of doing this, and I'm hoping Angular Directives can help. Here's an example of how I imagine it could work: table class=item_table sort-rows aggregate-identical-rows-in-rightmost-column make-rowspans-for-identical-cells make-alternating-rows-different-colours tr thTeam/th thProduct/th thCount/th /tr tr ng-repeat=row in all_data_rows tdrow.team/td tdrow.product/td tdrow.count/td /tr /table The problem is that when any of the directives in the table tag run, the rows created by the tr ng-repeat... don't exist yet. From this mailing list I see that I could go to the innermost ng-repeat and call a directive that checks for $last at every level, but this seems sketchy and is a really weird place to put those directives. Am I trying to use directives for things they aren't designed for? Is $last really a perfectly good solution, even if I have nested ng-repeats and I have to check for $last all the way out to the table tag? Does anyone have a good way of doing this angularly? I know there are javascript approaches I could take, but once the contents of the cells get more complicated (e.g. buttons), those get messier. This solution just seems so pretty if it would only work. I'd appreciate any thoughts. Thanks, Bartholomew -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: How does app.config() work?
There should only be one config(). You can mass multiple dependencies into it... that's what the Array[] syntax is. Notice the array passed into config() has many string-names to reference each provider needed, then the variable names are passed as arguments into the function. So anytime you need more dependencies, just add it in both spots. app.config(['$routeProvider','$locationProvider', function($routeProvider, $locationProvider){ $routeProvider.when('/home'{ ... }); //all the route stuff... shortened for example $locationProvider.html5Mode(true).hashPrefix('!'); }]); Now that you've set html5Mode, you shouldn't have to add anchors to your links: a href=/gamesGames/a On Sat, May 2, 2015 at 12:13 PM, Mariusz Wilk szostakow...@wp.pl wrote: Thx! So I ended up using the following to get it to work: My index.html includes: lia href=/#/gamesGames/a/li and my config() function includes: .when('/games', { controller: 'Games', templateUrl: 'controllers/games.html' }) It works but as you can see I need to use a # in my href since it simply appears in the url on its own. I saw a suggestion to add the following: app.config(['$locationProvider', function($locationProvider){ $locationProvider.html5Mode(true).hashPrefix('!'); }]); I did but as a separate config() function. And it doesn't work. Should I include this into my main config()? app.config(function($routeProvider){ $routeProvider .when('/', { controller: 'Posts', templateUrl: 'controllers/posts.html' }) .when('/games', { controller: 'Games', templateUrl: 'controllers/games.html' }) }); If so, how? -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/VjnEoJw2URI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: How does app.config() work?
Michael, I hear you, but it's probably not a good code pattern for a newbie. Understanding that you can add more dependencies vs creating a new config function for each provider is more the point here. I believed that to be the issue, but now I see maybe it's not. On Sat, May 2, 2015 at 2:23 PM, Michał Wasiluk mic...@wasiluk.io wrote: @Luke Kenede - Why there should be only one config block per module? Angular applies configuration blocks in the same order they were registered ( https://code.angularjs.org/1.3.15/docs/guide/module#configuration-blocks) I prefer to split large config blocks for code clarity. Regards sob., 2.05.2015 o 20:44 użytkownik Luke Kende luke.ke...@gmail.com napisał: There should only be one config(). You can mass multiple dependencies into it... that's what the Array[] syntax is. Notice the array passed into config() has many string-names to reference each provider needed, then the variable names are passed as arguments into the function. So anytime you need more dependencies, just add it in both spots. app.config(['$routeProvider','$locationProvider', function($ routeProvider, $locationProvider){ $routeProvider.when('/home'{ ... }); //all the route stuff... shortened for example $locationProvider.html5Mode(true).hashPrefix('!'); }]); Now that you've set html5Mode, you shouldn't have to add anchors to your links: a href=/gamesGames/a On Sat, May 2, 2015 at 12:13 PM, Mariusz Wilk szostakow...@wp.pl wrote: Thx! So I ended up using the following to get it to work: My index.html includes: lia href=/#/gamesGames/a/li and my config() function includes: .when('/games', { controller: 'Games', templateUrl: 'controllers/games.html' }) It works but as you can see I need to use a # in my href since it simply appears in the url on its own. I saw a suggestion to add the following: app.config(['$locationProvider', function($locationProvider){ $locationProvider.html5Mode(true).hashPrefix('!'); }]); I did but as a separate config() function. And it doesn't work. Should I include this into my main config()? app.config(function($routeProvider){ $routeProvider .when('/', { controller: 'Posts', templateUrl: 'controllers/posts.html' }) .when('/games', { controller: 'Games', templateUrl: 'controllers/games.html' }) }); If so, how? -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/VjnEoJw2URI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/VjnEoJw2URI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: How does app.config() work?
You don't, it will make the connection for you. Just put ng-view somewhere in the html below the navbar, the link click will be caught by angular, then look at your config and decide what template/controller to load at the point of ng-view element. (consider using html5mode: $locationProvider.html5Mode(true).hashPrefix('!');) body ng-controller='MainCtrl' nava href=/home/aa href=/contact/a?/nav div ng-view/div /body $routeProvider .when('/home', { templateUrl: '/partials/home.html', controller: 'HomeCtrl' }) .when('/contact', { templateUrl: '/partials/contact.html', controller: 'HomeCtrl' }); So if you were to use an actual button element, just change the location... button ng-click=goto('/home')Home/button .controller('MainCtrl', ['$scope', '$location', function($scope, $location){ $scope.goto = function(link){ $location.path(link); //this just changes the URL for you the same as clicking a link } } On Tuesday, April 28, 2015 at 11:44:43 AM UTC-6, Mariusz Wilk wrote: I'm new to programming and I'm trying to built my first simple website but I'd like to use some Angular.js. So when I click a button on the navbar I'd like the view and the controller to change. The way I understood it from the Codecademy course I could use app.config(function($routeProvider){...}) and depending on what's added to the Url the view and controller changes (but the navbar doesn't). That way I define a clear link between a Url and content. But where's the link between the navbar button and the Url? How do I bind these two? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: overriding tabset's tab select/click event
If you are using Angular UI Bootstrap there is a disabled attribute which you can set for each tab you want disabled: http://angular-ui.github.io/bootstrap/#/tabs On Wednesday, April 15, 2015 at 6:22:37 AM UTC-6, yogesh natu wrote: HI, I am having 3 tabs, having forms in each. I am looking to restrict user going on different tab, if user has started entering in form fields. I have written logic to find out by comparing model but i am not getting how to overide tab select/click event . Thanks Yogesh Natu -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Directives are my major fear in angular
I'd say start small and then build up to the more complex directives. Here's the simplest one I've built. It only requires a returning an object with a linking function. Following the syntax pattern, all you have to worry about is that the linking function is called when angular compiles the directive on your element. .directive('fallbackSrc',[ function(){ return { link: function(scope,element,attrs){ element.bind('error', function(e){ element.attr('src', attrs.fallbackSrc) }) } } } ]) img src=/some/image.png fallback-src=/another/fail-safe-image.png Inside the function, element is a jquery-lite wrapped object so jquery's functionality is already there. All it does is on the error event, is set the element's src attribute to the fallbackSrc attribute. You can keep reading tutorials until your heart is content, but I gained real understanding by jumping in, copying others ideas, then tweaking it, etc, until the pieces bean to make more sense. Good luck! On Wednesday, April 15, 2015 at 5:54:33 PM UTC-6, Christian Nwamba wrote: Hi peeps! I feel am the biggest lover of angular and it's my favourite developer tool. The only problem is that I get limited when I want to use external or custom tools and make use of a reusable component. I know this is my inability to harness the potentials of directives but I have been trying my best but not just getting it right yet. Can anyone help me with perfect article(s) that will make angular directives be my best friend. Definitely you should know I have seen the tutorial and examples on angular website. Thanks and Regards! Chris -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: why datepicker doenst open with ng-click='opened=true'
Could also be due to the primitive reference... try putting your boolean on an object: scope.picker = { value: '', opened: false } input type=text class=form-control datepicker-popup=dd.MM. ng-model=picker.value is-open=picker.opened min-date=minDate max-date='2015-12-31' datepicker-options= {formatYear: 'yy',startingDay: 1}; date-disabled=disabled(date, mode) ng-required=true close-text=Close / button type=button class=btn btn-default ng-click=picker.opened=true On Monday, April 13, 2015 at 11:46:07 PM UTC-6, Stefan Schmidt wrote: We had problems with the datepicker not opening when it was inside a div that had a ng-if statement - maybe that helps ... Am Montag, 13. April 2015 08:18:19 UTC+2 schrieb sar...@ppedv.de: Comes from default samples, that for opnen is always a Controller function to set the property opened I am looking for the reason why following- shorter code doesnt work input type=text class=form-control datepicker-popup=dd.MM. ng-model=dt is-open=opened min-date=minDate max-date='2015-12-31' datepicker-options= {formatYear: 'yy',startingDay: 1}; date-disabled=disabled(date, mode) ng-required=true close-text =Close / span class=input-group-btn button type=button class=btn btn-default ng-click=opened=true i class=glyphicon glyphicon-calendar/i /button -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: I have an app template that needs page-title parameter, but how?
Just as plain-ol-javascript would use window.document.title... angular has a safe reference to $window $window.document.title Just inject it into your controller to use it. BUT... you're example looks like a different question. You just need to keep up with a reference to the current nav's current selected index and set $scope.pageTitle = basicNav[index].label. ...if I understand your code correctly. On Wednesday, April 15, 2015 at 1:08:02 PM UTC-6, Frank Tudor wrote: This might be elementary but I am treading water and cannot find a good example from Google Search. The problem I have is I need to populate the page title to the app-template page-title parameter using {{pageTitle}} It is part of the scope but some how I need to fish out the basic nav current page (that I am on and pop that puppy here. How do I do this? Thanks, Frank html ng-app=VizMe hover-stop= class=ng-scope body ng-controller=ctrlr class=ng-scope macc-app-template app-title=Visualize page-title={{pageTitle}} How??? nav-content=nav class=ng-isolate-scope script angular.module('VizMe', ['macc']).controller('ctrlr', ['$scope', function($scope) { var basicNav = [ {label:'Home', url:'index.cfm?template=a'}, {label:'MACC Gear', url:'index.cfm?template=b'}, {label:'Alatus', url:'index.cfm?template=d'},the lbael from this needs to get to a the pageTitle variable below {label:'Osteons', url:'index.cfm?template=e'} ]; var noNav = []; $scope.showNav = true; $scope.nav = basicNav; $scope.setNav = function(showNav) { $scope.nav = showNav ? basicNav : noNav; }; $scope.pageTitle = 'Need label of the current page to populate here?'; How??? }]); /script -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] ng-src not working in ng-bind-html
Are you trying to replace complete blocks of html? Then yes, use ng-include as Caitlin recommends. For ng-src is interpolated not, bound to a variable... the proper way to change the source in your case should be: img ng-src={{imagevar}} This is advantageous because you can change, parts of the url only, like if you know it's always the same file name but the directory changes: img ng-src={{current_directory}}/image.png On Tuesday, April 14, 2015 at 2:20:48 PM UTC-6, Marco wrote: OK, thanks for the reply, I will check these options -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Enable/Disable Save button according to changes in Form(DOM) data
Well, you could bind each form field to a scope object and $watch the object for changes scope.myForm = { field1: 'initial_value', field2: null, field3: false } scope.$watch('myForm', function(newFields, oldFields) { if (newFields.field2.length) { scope.buttonDisabled = true; } else if (!newFields.field3){ scope.buttonDisabled = true; } }, true); //notice this tells the $watcher that it's to catch any change on the object On Monday, April 13, 2015 at 4:33:06 AM UTC-6, ADITYA wrote: Hi, I have a scenario, where on page load, I have to disable Save button Button will be enabled only when there is some change in form(DOM). Here one case is also that after making changes if we revert the changes then button should be disabled. I want to make a watch on Form(DOM). Here My question is how to make a watch on Form data. How to store Firm initial data. How to compare old data with new data(After any changes) to show button enabled. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Minification of angular files
Personally use Codekit (Mac) for both minification and sass compilation. It may be simpler to start with for you, maybe not, but throwing out something else to offer. On Tuesday, March 17, 2015 at 5:13:30 AM UTC-6, Volodymyr Stolyarchuk wrote: yes, it is possible and tools like gulp or grunt is most simple for this tasks) On Tue, Mar 17, 2015 at 12:36 PM, Satish B technotip...@gmail.com javascript: wrote: GULPJS is really confusing me :( It is used on the client side right? I want to just concatinate and minify my angular files like - services.js, filter.js, controller.js and if possible bootstrap files. Hope all this is possible? Still not able to figure out :( On Monday, March 16, 2015 at 6:23:56 PM UTC+5:30, Satish B wrote: Hi guys, I've done a small project in angular. I've a lot more to learn. For now I want to know how to minify all the JavaScript files I'm using in my project? Is there a way I can merge all the files into one? If so, please let me know the steps. *Thanks a lot ..* -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com javascript:. To post to this group, send email to ang...@googlegroups.com javascript:. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: ngResource.query - Problems sending complex parameters
I almost know enough to answer this, but can at least point out some direction. First, have you tried a JSON string as opposed to sending an object. conditions: '{age: { $gt: 30 } }' Second, are you sure the server cannot decoded the escaped characters? I have been able to handle both cases with PHP or Node. Last, do the parameters need to be URL search params? There's also a way to send JSON as a payload. I believe you can accomplish this by not passing them as params, but as part of the resource object: var Customer = $resource('http://localhost:3000/api/users'); Customer.conditions = { age: { $gt: 30 }; Customer.options: { limit: 2 }; This is just off the top of my head so may not work, but it's what I would try. Good luck. On Wednesday, December 10, 2014 11:49:56 AM UTC-7, Ruben Costa wrote: Hi, i have the same questions. Did you get any answer elsewhere? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Defining a resource URL globally.
Great! Glad that got you going. Timing is one of the bigger challenges with angular I have found. For example, I have my app set up such that initial data is loaded in app.run and once all xhr calls are complete, it then sets a ready variable on $rootScope. Each controller $watches this variable such that no matter what URL a user comes in to the app on, certain routines don't fire until that ready variable is set. It only has to be set that one time for the life of the app (until a refresh). On Fri, Sep 12, 2014 at 9:03 AM, Dan Martin dlmarti...@gmail.com wrote: Luke, thanks to your suggestion, I was able to get passed this. I broadcast an event that gets fired when the app becomes ready/available from within app.run (as you suggested). Then, I have a DB service that reacts on the event, retrieving the CBL URL (via CBL plugin) and saves it in memory (variable) for future DB requests (via REST) from my factories. On Thursday, August 28, 2014 2:06:03 AM UTC-4, Luke Kende wrote: $watch in app.run and broadcast event to controllers, you'll need some loading screen. It's timing, you control that by not letting things execute until they are ready. You can also wait until the value is present before bootstrapping angular if you prefer. On Wednesday, August 27, 2014 1:01:33 PM UTC-6, Dan Martin wrote: I'm working on a hybrid (Ionic http://ionicframework.com/ - AngularJS-based mobile framework) mobile application that has an embedded NoSQL datastore, Couchbase Lite http://www.couchbase.com/mobile. CBL plug-in for PhoneGap/Cordova/Ionic only provides a method for retrieving the URL of the embedded DB. And it seems like it's only accessible on device ready (I tried calling the function else where and didn't work). I was hoping to resolve the URL during Angular's bootstrap phase and save it to the rootScope so it's accessible elsewhere in the application, particularly in my services, but this didn't work either. I'm kind of stuck because there is no other way for me to provide a URL for my resources. Thoughts...solutions?? Thanks, Dan -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/1_XmE63Yq30/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Defining a resource URL globally.
$watch in app.run and broadcast event to controllers, you'll need some loading screen. It's timing, you control that by not letting things execute until they are ready. You can also wait until the value is present before bootstrapping angular if you prefer. On Wednesday, August 27, 2014 1:01:33 PM UTC-6, Dan Martin wrote: I'm working on a hybrid (Ionic http://ionicframework.com/ - AngularJS-based mobile framework) mobile application that has an embedded NoSQL datastore, Couchbase Lite http://www.couchbase.com/mobile. CBL plug-in for PhoneGap/Cordova/Ionic only provides a method for retrieving the URL of the embedded DB. And it seems like it's only accessible on device ready (I tried calling the function else where and didn't work). I was hoping to resolve the URL during Angular's bootstrap phase and save it to the rootScope so it's accessible elsewhere in the application, particularly in my services, but this didn't work either. I'm kind of stuck because there is no other way for me to provide a URL for my resources. Thoughts...solutions?? Thanks, Dan -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: code design advice needed for managing 2 different lists
For these sort of tasks I'd recommend underscore.js. Either diff() or filter() http://underscorejs.org/. Even if you use a directive, you have to write the logic to perform the task, but no, don't use a directive, write smart functions and use cool tools like underscore. Then if you are using $http, something like: $scope.myItems = []; $scope.availableItems = []; $http.get(/api/my-items).then(function(myItems){ $scope.myItems = myItems; getAvail(); }); function getAvail(){ $http.get(/api/avail-items).then(function(avaiItems){ //if primitive values use diff() $scope.availableItems = _.diff(avaiItems, $scope.myItems); //or if it's an array of objects and say you can identify by id field, then here's an example with filter() var ids = _.pluck($scope.myItems, 'id' ); //creates an array of ids from myItems $scope.availableItems = _.filter(avaiItems, function(item){ //now we just check the index return _,indexOf(ids, item.id) == -1; //returns true if index not found so will be in the final item, false if found so will be eliminated }); }); } Though, I might do it a third way and use an attribute on availableItems for whether or not the item is in myList. Hope that gives you some direction. On Monday, July 28, 2014 1:40:42 PM UTC-6, Skattabrain wrote: AngularJS noob here with a design question. I have 2 lists... one is a list of items for a specific group. Let's call the group My Items. The 2nd list is a master list of all the items available - Available Items. This 2nd list can be changed out for other lists. So you might have Available Items of Type 1 and Available Items of Type 2 etc... I show the Available Items on the left and the My Items on the right. If you visualize a shopping cart system where the available items are on left and you are moving them into your cart, that's a good way to visualize this. $scope.myItems = [] and $scope.availableItems = [] So I start off with 2 ajax calls... 1 for 'my items' and the 2nd call gets the currently selected 'available items' lists. The available items on the left may include items that are in 'my list' but they should not be shown. I have a relatively in-efficient loop I run through to see if the item is in my items and if it isn't, I push it to the scope - $scope.availableItems There is the issue that the 'myItems' list has to be completed before i call for the availableItems in case myItems isn't complete... as the comparison will not be right. I then have tools to move selected items in and out of the myItems. Is there a better way though the use of a directive that will watch for changes to myItems and remove/add them to the availableItems? I've been dropped into AngularJS with a relatively complicated task. These lists involve thousands of items and we chose angular because i can throw 15,000 items into a scope and as long as I have paging setup... i can filter and sort the whole thing easily, that's working amazingly well. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Fetching app configs from remote url
How about loading a script tag in your html head that points to a remote javascript file? If you need something before angular bootstraps, then you'll need to accomplish it outside of angular. On Thursday, May 29, 2014 8:46:30 AM UTC-6, Joberto Diniz wrote: In my project, I need several configs values to configure the app accordingly. These configs would be use in the angular config phase, run phase and in the services. I could create a angular service, like angular.module('myapp').value(OBJECT_WITH_CONFIG_VALUES). However, I can't do that, because the config values MUST be fetched from a remote server. So, I would execute an http get call, get the json result, and only then use the config values from the json result. How can I accomplish that? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: how to use jquery inside partials
Don't try to mix jquery in like this. Learn how to use directives. On Thursday, May 29, 2014 3:23:06 AM UTC-6, Daniel Lopez wrote: Hi, I'm trying to to use some jquery inside a partial. what I want to do is a .slideToggle() of a div, inside a partial. this is my script $(.glyphicon-minus).click(function (event) { //ocultar grafico (panel body) var status = $(event.target).attr('id').split(_); $(#accordion_ + status[1] + _ + status[2]).slideToggle(slow); }); and this is my html div class=col-sm-6 id=chart_0_1 div class=panel panel-success div class=panel-heading div class=btn-group style=float:right; i class=glyphicon glyphicon-minus id=minimize_0_1/i /div h3 class=panel-titleVolume de Negócios/h3 /div div id=accordion_0_1 class=panel-body nvd3-multi-bar-chart data=graficos[0] id=dataChart_0_1 height=400 showXAxis=true reduceXTicks=true showYAxis=true showLegend=true showControls=true tooltips=true svg/svg /nvd3-multi-bar-chart /div /div /div I've been reading but i can´t figure it out. Can someone help me? Thanks -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: href link to route with params
If you are using $locationProvider.html5Mode(true) then you don't need to put the anchor tag in there... still it seems that {{lang}} is not interpolating so you may have a scope issue. On Tuesday, May 27, 2014 3:57:20 PM UTC-6, Joberto Diniz wrote: I don't follow.. Tried: ng-href=#/{{lang}}/catalog Doesn't work, it renders: #//catalog On Tuesday, May 27, 2014 6:20:10 PM UTC-3, miguel@creativesystems.eu wrote: Hi, Use ng-href: https://docs.angularjs.org/api/ng/directive/ngHref Regards, Miguel Terça-feira, 27 de Maio de 2014 22:14:03 UTC+1, Joberto Diniz escreveu: I set up the following route configuration: $routeProvider.when('/:lang/tv', { templateUrl: '/mainModule/partials/tv.html', controller: TvController }); $routeProvider.when('/:lang/catalog', { templateUrl: '/mainModule/partials/catalog.html' }); However, how can I use this in the href of an anchor tag? a href=#/tv class=topbar-link text-center id=topbar-catalog/a What to put in the href to point to the :lang/tv route? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: ng-select with default values and overwrite of those values when event is triggered.
ng-repeat just acts on the scope array (or object) so to overwrite values, just update the scope reference. On Tuesday, May 27, 2014 6:50:50 AM UTC-6, Stathis Gaknis wrote: I have an ng-select. Initially the select - options are populated from the server with a foreach. Then on an event trigger I want to overwrite these values from an ajax call. How can I do this.? I have already implemented the ajax call but how can I overwrite the default values? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: view controller $scope.$on watch function not working...
So, here's what I am understanding about your order of events, simplest scenario... 1. User comes to home page and is not logged in therefore sees Login form. 2. User enters credentials and clicks login, which let's say is successful, so factory method sets it's local isLoggedIn value to true and broadcasts the event. 3. At this point in time, the MainController and the LoginController are still active controllers on the page. MainController gets the broadcast (but not sure why, maybe to change the state of the menu navigation?). LoginController runs the promise.then() function which sets it's own state variable for isLoggedIn (but not sure why here either as the view is about to change), then redirects the angular route so the new view is loaded with the ClientController to show the account info. Why does the ClientController need the broadcast? To get the phpData? If this is true, I'd say put the object data on the factory instance and by injected it into the ClientController you will have access to the user's logged in data (or anywhere throughout the app). factory.user = { isLoggedIn : false, data: null }; // in $http promise.then() if (phpData.account_type === 'client') { // $timeout(function() { broadcast('clientAuthenticated', phpData); factory.user.data = phpData; // }, 1000); return phpData; } On Sun, Apr 20, 2014 at 7:54 PM, Billy Figueroa figue...@gmail.com wrote: FIY ignore the time functions. I was only using those to see if the broadcast worked. This is not part of my original code On Thursday, April 17, 2014 9:53:56 PM UTC-4, Billy Figueroa wrote: Hi All, so I have a quick issue with my controller ordering I guess. I have the following shell page layout... html head/head body ng-controller=MainController div ng-view/div /body /html I have an ng-view template that the routeProvider is loading (account.php) when we hit the url and load ClientController... .when('/client/:user_id/account', { templateUrl: '../MINT/views/account.php', controller: 'ClientController', restrict: true }) I also have an AuthFacotory factory where, once a user logs in and I get data back from my backend (PHP) I broadcast a signal to say we are authenticated if (phpData.account_type === 'client') $rootScope.$broadcast('clientAuthenticated', phpData); else $rootScope.$broadcast('providerAuthenticated', phpData); I have the following I guess watches both inside the MainController and ClientController -- MainController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ MainController]); }); -- ClientController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ ClientController]); }); I am only catching the one in the MainController. Based on the structure being that the ClientController is loaded as part of the view, I m guessing its some sort of a child of the MainController but why is it not catching that broadcast? the weird part is that I have other code in the ClientController and that gets executed but the console.log inside the scope statement is not I wanted to create a jsfiddle or plunker but I rarely get them working when I try to do it in a non global modular way like real apps are written i.e. var myApp = angular.module('myApp', []) -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/NaBscLyPqhY/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: view controller $scope.$on watch function not working...
The problem is that a controller specified for a route template only exists in memory at the time of the route match. As soon as you leave and come back to a route/view, no state is maintained on the controller, the view runs the controller function all over again. This is probably why you are confused about ClientController not getting the $broadcast event... it must be the active route/view to be listening. You will have to store the user data in a service and inject it (or use rootScope or MainCtrl scope since those don't get removed). Hence, you are rebuilding your scope each time you load the route: /client/:user_id/ account function clientController($scope, AuthFactory, DataService){ $scope.userData = DataService.userData; //by putting object data on scope, any update to DataService.userData from other controller automatically binds to the service and therefor the loaded view template } On Sun, Apr 20, 2014 at 9:49 PM, Billy Figueroa figue...@gmail.com wrote: I have not decided yet of how I am going to handle updating the user status button to login or logout. Not sure what controller I want to put it in yet so that is why you see multiple controllers with a user.isLoggedIn attribute, so just ignore that. As far as why not grab the data from the auth service... This is my Auth service which should only handle login/ logout etc The broadcasting is so I can put listeners on controllers who will then grab data from my userData or dataFactory. This service will grab all the data I need from from the backend and then I can grab the data from both my client and provider controllers. something like this inside the client controller $scope.$on('clientAuthenticated', function(phpData) { $scope.clientData = userData.getData() }); On Sunday, April 20, 2014 11:02:00 PM UTC-4, Luke Kende wrote: So, here's what I am understanding about your order of events, simplest scenario... 1. User comes to home page and is not logged in therefore sees Login form. 2. User enters credentials and clicks login, which let's say is successful, so factory method sets it's local isLoggedIn value to true and broadcasts the event. 3. At this point in time, the MainController and the LoginController are still active controllers on the page. MainController gets the broadcast (but not sure why, maybe to change the state of the menu navigation?). LoginController runs the promise.then() function which sets it's own state variable for isLoggedIn (but not sure why here either as the view is about to change), then redirects the angular route so the new view is loaded with the ClientController to show the account info. Why does the ClientController need the broadcast? To get the phpData? If this is true, I'd say put the object data on the factory instance and by injected it into the ClientController you will have access to the user's logged in data (or anywhere throughout the app). factory.user = { isLoggedIn : false, data: null }; // in $http promise.then() if (phpData.account_type === 'client') { // $timeout(function() { broadcast('clientAuthenticated', phpData); factory.user.data = phpData; // }, 1000); return phpData; } On Sun, Apr 20, 2014 at 7:54 PM, Billy Figueroa figu...@gmail.comwrote: FIY ignore the time functions. I was only using those to see if the broadcast worked. This is not part of my original code On Thursday, April 17, 2014 9:53:56 PM UTC-4, Billy Figueroa wrote: Hi All, so I have a quick issue with my controller ordering I guess. I have the following shell page layout... html head/head body ng-controller=MainController div ng-view/div /body /html I have an ng-view template that the routeProvider is loading (account.php) when we hit the url and load ClientController... .when('/client/:user_id/account', { templateUrl: '../MINT/views/account.php', controller: 'ClientController', restrict: true }) I also have an AuthFacotory factory where, once a user logs in and I get data back from my backend (PHP) I broadcast a signal to say we are authenticated if (phpData.account_type === 'client') $rootScope.$broadcast('clientAuthenticated', phpData); else $rootScope.$broadcast('providerAuthenticated', phpData); I have the following I guess watches both inside the MainController and ClientController -- MainController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ MainController]); }); -- ClientController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ ClientController]); }); I am only catching the one in the MainController. Based on the structure being
[AngularJS] Re: item in Items happy problem
Change to: $scope.Items = []; //no curly braces - this is an empty array, no need to define an empty object On Friday, April 18, 2014 3:09:42 PM UTC-6, Leonardo Alfonso Tapia Delgado wrote: Hi, i have a problem with *ng-repeat*, in the view is rendered a default value {}, ¿How I can remove the {} and show only when you have added items to your order? *I do not speak English, I make an effort with google translator* https://lh4.googleusercontent.com/-ii1yG5HtxJc/U1GP5LmCsRI/Ags/4-xrvjkE1EY/s1600/Captura+de+pantalla+de+2014-04-18+16%3A01%3A52.png https://lh3.googleusercontent.com/-Vt_12WnzD1U/U1GP7rFzxKI/Ag0/QJAGuvBSIaQ/s1600/Captura+de+pantalla+de+2014-04-18+16%3A01%3A49.png https://lh3.googleusercontent.com/-0gcgpBEJE7g/U1GP02wqw9I/Agk/eOdAKVtihEE/s1600/Captura+de+pantalla+de+2014-04-18+16%3A07%3A37.png -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Distinguish between bound and unbound forms
Yeah, have not heard of bound form before, but it make sense whatever you want to call it. More abstractly, I'd call it maintaining state... for your form. I have a similar case where a user selects values, can go away and come back to the same page. I use a service to maintain state variables and share data between controllers in my single page app (meaning I'm not posting or reloading the page once loaded). form input type=text ng-model=formValues.username input type=text ng-model=formValues.email button ng-click=resetFormReset/button /form function MyCtrl($scope, StateService){ $scope.formValues = StateService.formValues; //will magically two-way bind not only to your controller variable but also the state service that lives for the lifetime of the app $scope.resetForm = StateService.reset//will happen in service and controller, and also in UI } function StateService(){ var state = { formValues: { user: null, email: null }, resetToDefaults: function (){ this.formValues.user = 'Dave'; this.formValues = 'd...@gmail.com' } } return state; } Now if we are talking about reloading the page and maintaining state, then you'll need to push and pull the values between the controller and the server, local storage, or cookies. Once again, I'd user a service to call and get the state from either ajax, storage, or cookies, but same principals apply. On Friday, April 18, 2014 12:36:54 PM UTC-6, Jacob Rief wrote: Django distinguishes between bound and unbound forms. In bound forms, fields are rendered with values, often from a previous unsuccessful attempt of posting the form. In unbound forms, the values of form fields are empty. There is a problem when using bound forms in AngularJS, since the pre-rendered values are not visible for its fields. Currently I use a custom directive named form, which resets the field with its default value using $setViewValue. Questions: 1. Is it good practice to add another directive named form to a custom Angular module, and if, which priority shall this directive have? I currently use -1. 2. Do I assume correctly, that the terminology bound form is somehow Django specific und thus not used by Angular developers? a. If NO, is there a way in AngularJS to find out, if a form is bound or not? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Can I create an HTML email from an Angular form?
Angular works in the browser, not on the server, so you aren't going to be able to use angular to get the generated html going into your email. But yes, you can post the input data from the input form by using ajax via $http in your controller to asp.net page that simply captures the data, creates a service-side html view and sends it in an email. On Friday, April 18, 2014 9:10:44 AM UTC-6, cmi...@onlinetransport.com wrote: I have an ASP.NET MVC application for which I started using Angular in a data collection form. The data must be sent in an HTML-formatted email, and doesn't really need to be persisted in a database. So I was wondering how I could pass the Angular input data to the ASP.NETcontroller action, or maybe directly to the HTML View file for emailing. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Bad argument error on Android 2.3
I've seen this before on other browsers (IE). For me, it meant a javascript resource is failing to load, or is generating an error that worked in other browsers. You need the equivalent of the developer console on that browser in Android to see what's happening if this is the case. I could be completely wrong... but it's something I know to look for in this case. On Friday, April 18, 2014 6:48:08 AM UTC-6, Ivan Borushko wrote: File with controller is angular.module('myApp').controller('MyCtrl', function ($scope, $state, $location) { console.log(asd); } On Friday, April 18, 2014 2:42:50 PM UTC+3, Ivan Borushko wrote: Hi everyone. I have an issue. When i load the page on android 2.3 it says Bad argument, MyCtrl not a function, got undefined. And it only one page issue. But on another android versions and on desktop everything works just fine. There are no any errors or warnings. But not on android 2.3 Any suggestions guys?;) -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Proper way dealing with SSO (simplesamlphp) in angular?
Don't know simpleSamL but I know that since we already used an old-school post form in drupal, we just redirect users who are not logged in there. Then php sets the cookie, then we redirect back to the angular app if need be (a url param determines this). Once Angular is loaded we can verify the cookie via $http or websockets. But we didn't make the best choices there, but it was the quickest so we could focus on the app.. there are much better login approaches out there... just sharing our approach. On Friday, April 18, 2014 4:28:20 AM UTC-6, Andrius Kulbis wrote: Hi, I came across with this AngularJs thing, and I thing it is awesome, really solves many problems I confronted while working on my last WebApp with just a few lines of code. Now, what I didn't find or was looking in bad places is the protection of AngularJs app with SSO (simpleSAMLphp Identity provider). How to deal with this? What I am going to build will use Pyramid framework as a backend REST API, and AngularJs (I wish) for the frontend. But how to protect the app from unauthorized access, skipping the sso login. Any implementation example or lessons working on similar case would help (may be with php, ruby backends and SSO etc) Regards, Andrius -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: How to find which controller a specific data binding value is coming from
Sounds like you are chasing your tail :} I don't see that the $scope identifies it's controller. The fact that your example doesn't use the dot syntax like item.value, makes it more likely to be the immediate controller. You can access the scope variable: http://stackoverflow.com/questions/13743058/how-to-access-the-angular-scope-variable-in-browsers-console By looking at the $scope data structure you should be able to identify methods on it that would belong to a specific controller versus another. On Thursday, April 17, 2014 12:03:14 PM UTC-6, Sean Bollin wrote: I have a data binding in the view {{ value }} I want to find out what controller that $scope.value is being set in How do I do this? -- I tried clicking on the element in Chrome and following up the parent chain until I found the value (10 objects up) - not efficient Even when I get to that object, is there a controllerName property somewhere? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: angularJS parsing xml problem beanJSON
http://rabidgadfly.com/2013/02/angular-and-xml-no-problem/ On Thursday, April 17, 2014 8:04:10 AM UTC-6, Dude wrote: Hi All, I have an xml file like this : Response StatusOK/Status Books Book id1/id /Book Book id2/id /Book /Books /Response it is Content-Type: application/xml;charset=UTF-8 when I call $http.get I get a strange object in return, for example if I want the first id I have to do : data.Response.value.BooksBeanJSON.listBookBeanJSON[0].id ??? why .value. ? why BeanJSON ? and listXxxxBeanJSON ? I which I had a String object so I could parse it myself but I don't have :( Secondly when I put a copy of this xml on a file accessed throught my local apache (still Content-Type: application/xml;charset=UTF-8 ) I have a String result. Why is it different ? Then if I parse it using x2js it's fine : data.Response.Books.Book[0].id can't find anything on the net, pls help -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: view controller $scope.$on watch function not working...
Well, without seeing the code, it was an option that the broadcast was happening before the child controller had registered the listener. Now that I see the code, that is not the case. So I added the factory login method on the child scope. Now clicking the button fires the broadcast and both listeners fire as well: http://plnkr.co/edit/Ti2nerqta29HPH8DZTBt?p=preview On Fri, Apr 18, 2014 at 11:42 AM, Billy Figueroa figue...@gmail.com wrote: Hey what do you mean is loaded at the time of the broadcast' I know the controller is active becasue I have some json files I am loading for drop down menus and those are all loaded, but we never go into the $scope.$on code to the console.log statement. I am trying to recreate this and this is why I dislike plunker and jsfiddle, they always give me problems.. why is this not working... http://plnkr.co/edit/h3a6ZwkUF2vCy36gEPUe?p=preview I can't get the AuthFactory to work. I tried to add a button to console.log when I click but it doesnt do anything On Friday, April 18, 2014 1:45:29 AM UTC-4, Luke Kende wrote: This could be a timing thing. Are you sure your listener ($scope.$on) in client controller is loaded at the time of the broadcast? Another console.log just before the registration may help you see if that's the case. I don't believe that main as parent would override the child controllers handler, but I have had it happen in one of my directives you can verify by commenting out the one in main to double check. On Thursday, April 17, 2014 7:53:56 PM UTC-6, Billy Figueroa wrote: Hi All, so I have a quick issue with my controller ordering I guess. I have the following shell page layout... html head/head body ng-controller=MainController div ng-view/div /body /html I have an ng-view template that the routeProvider is loading (account.php) when we hit the url and load ClientController... .when('/client/:user_id/account', { templateUrl: '../MINT/views/account.php', controller: 'ClientController', restrict: true }) I also have an AuthFacotory factory where, once a user logs in and I get data back from my backend (PHP) I broadcast a signal to say we are authenticated if (phpData.account_type === 'client') $rootScope.$broadcast('clientAuthenticated', phpData); else $rootScope.$broadcast('providerAuthenticated', phpData); I have the following I guess watches both inside the MainController and ClientController -- MainController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ MainController]); }); -- ClientController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ ClientController]); }); I am only catching the one in the MainController. Based on the structure being that the ClientController is loaded as part of the view, I m guessing its some sort of a child of the MainController but why is it not catching that broadcast? the weird part is that I have other code in the ClientController and that gets executed but the console.log inside the scope statement is not I wanted to create a jsfiddle or plunker but I rarely get them working when I try to do it in a non global modular way like real apps are written i.e. var myApp = angular.module('myApp', []) -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/NaBscLyPqhY/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: view controller $scope.$on watch function not working...
Billy, Yes starting into angular really changes the way we think. Timing is one of the main challenges I've run into (if you haven't hit that issue yet, you will), in addition to organization of code. Angular provides an awesome framework for structuring your app, but it does not provide a standard way to go about achieving the result you are after. It's great that it's flexible, but also challenging to understand how the components fit together. By creating your login method in a factory or service, you can inject it into any controller, and since it is using rootScope to broadcast, really any controller can add a listener to react to it. Once again, it's up to you how to structure views and controllers. Having the login come into the client controller is fine since any controller (main or child or other) can add a listener and respond. Good luck. Luke On Fri, Apr 18, 2014 at 3:12 PM, Billy Figueroa billyj.figue...@gmail.comwrote: Luke I think you just helped me realize what is going on. This entire issue I believe comes from the fact that I have a login drop down menu which can be used from ANY page using the index.html shell page By default the MainController is on every page and it seems the login functions which I currently have in MainController SHOULD BE in ClientController. The problem is that the way I have the HTML setup, ClientController is LOADED upton hitting a certain route. I have been contemplating moving the login form to its own page. I think doing this will solve my issue. I was already having issues with this set up before but I like the easyness of having a dropdown from anypage as opposed to a seperate page To simplify things, since this is my first angularjs app, I will remove the dropdown Thanks, I think this will solve the issue...I HOPE! On Friday, April 18, 2014 4:39:41 PM UTC-4, Luke Kende wrote: Well, without seeing the code, it was an option that the broadcast was happening before the child controller had registered the listener. Now that I see the code, that is not the case. So I added the factory login method on the child scope. Now clicking the button fires the broadcast and both listeners fire as well: http://plnkr.co/edit/Ti2nerqta29HPH8DZTBt?p=preview On Fri, Apr 18, 2014 at 11:42 AM, Billy Figueroa figu...@gmail.comwrote: Hey what do you mean is loaded at the time of the broadcast' I know the controller is active becasue I have some json files I am loading for drop down menus and those are all loaded, but we never go into the $scope.$on code to the console.log statement. I am trying to recreate this and this is why I dislike plunker and jsfiddle, they always give me problems.. why is this not working... http://plnkr.co/edit/h3a6ZwkUF2vCy36gEPUe?p=preview I can't get the AuthFactory to work. I tried to add a button to console.log when I click but it doesnt do anything On Friday, April 18, 2014 1:45:29 AM UTC-4, Luke Kende wrote: This could be a timing thing. Are you sure your listener ($scope.$on) in client controller is loaded at the time of the broadcast? Another console.log just before the registration may help you see if that's the case. I don't believe that main as parent would override the child controllers handler, but I have had it happen in one of my directives you can verify by commenting out the one in main to double check. On Thursday, April 17, 2014 7:53:56 PM UTC-6, Billy Figueroa wrote: Hi All, so I have a quick issue with my controller ordering I guess. I have the following shell page layout... html head/head body ng-controller=MainController div ng-view/div /body /html I have an ng-view template that the routeProvider is loading (account.php) when we hit the url and load ClientController... .when('/client/:user_id/account', { templateUrl: '../MINT/views/account.php', controller: 'ClientController', restrict: true }) I also have an AuthFacotory factory where, once a user logs in and I get data back from my backend (PHP) I broadcast a signal to say we are authenticated if (phpData.account_type === 'client') $rootScope.$broadcast('clientAuthenticated', phpData); else $rootScope.$broadcast('providerAuthenticated', phpData); I have the following I guess watches both inside the MainController and ClientController -- MainController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ MainController]); }); -- ClientController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ ClientController]); }); I am only catching the one in the MainController. Based on the structure being that the ClientController is loaded as part of the view
Re: [AngularJS] I am a JavaSwing coder, and for a new project, I am facing to choose backbone or Angular, so just kindly ask which one is easier for me to learn with swing background
I had a similar experience to Billy. I tried backbone and many other frameworks (http://todomvc.com/) out there and then Angular was like magic with it's 2-way data-binding. Imagine having to go back to managing your memory in C from Java, backbone is a lot of grunt work. I agree if you know swing that GWT is going to get you going quicker. If you have some time to learn before a project is due, I recommend spending some time learning pure Javascript in addition to Angular. On Friday, April 18, 2014 4:34:19 PM UTC-6, Alain wrote: @Jason I dont know what makes you think that GWT start is going down but you are totally wrong about that. Actually GWT future has never been this bright. Even inside Google GWT is heavely used(new Google Sheet for example) And since Jackie said he has a Java background I dont know why he should nt use GWT. Then again GWT, Angular, etc are tools use the one that makes you more productive. We choose GWT and never looked back. On Friday, April 18, 2014 5:40:39 PM UTC+2, Jason Drake wrote: Alain's comment is succinct, but I think does lack some consideration. If you look at why you are moving away from Swing it is probably because of Oracle's incessant muddling of the waters with the Java Plugin and JRE as well as the piles of security hoops you need to jump through. I know I am there with two of my own apps (one I could maybe rewrite as a webapp.. the other there is no point). GWT is more similar to Swing if you choose a add-on library like GXT or SmartGWT, however I think most would agree on this point, GWT's star has started to go out and it is on its way down. All technologies do. Swing is in its sunset years. GWT is heading there. If you were going to invest in time and energy to learn a new framework/development technique I guess I wouldn't put it into GWT/Vaadin or Dart camps. Some considerations to consider: (1) Do you have an applicable server runtime for an HTML-5 application? ie. REST or (gasp... SOAP-XML) services? is there a clear separate between client state and server state? (2) Do you have knowledge, drive and resources to learn HTML-5 and JavaScript? jQuery mastership is not needed with Angular. I didn't know anything more than $(x) got element like things when I got started a year ago about jQuery. Now I can write AngularJS or jQuery applications. Many say not knowing jQuery first is an asset since you can adjust to thinking the angular way easier. (3) Complexity of the UI. If you are trying to make your swing app be HTML-5, then you may need to change the user paradigm. Angular and HTML-5 apps have a lot of power but they are harder to build master/view/navigate rich apps. I know I converted my full 60K line GWT app to Angular. Good luck - the community is hear to answer questions on AngularJS should you go that direction. On Friday, April 18, 2014 8:48:39 AM UTC-5, Alain wrote: GWT :) 2014-04-18 15:06 GMT+02:00 Jackie Wang jacki...@gmail.com: -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com. To post to this group, send email to ang...@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: directive design: pass through input attributes?
- You could use dynamic patterns: http://stackoverflow.com/questions/18900308/angularjs-dynamic-ng-pattern-validation - You could define your patterns in the directive template and then specify by another attribute like type: editable type=username value=userr.name/editable template: span class=user-info ng-hide=edit{{value}}/span ng-form name=innerForm ng-show=edit div ng-switch on=type input ng-switch-when=username ng-model=username type=text ng-pattern=/username pattern/ input ng-switch-when=password ng-model=password type=text ng-pattern=/password pattern/ input ng-switch-when=email type=text ng-pattern=/email pattern/ /div /ng-form a ng-show=!edit ng-click=edit=true On Friday, April 18, 2014 4:05:07 PM UTC-6, Nikita Tovstoles wrote: Hi, I am building an edit-in-place directive - similar to x-editablehttp://vitalets.github.io/angular-xeditable/#text-simple - a widget that toggles between an anchor displaying a value and an input editing it. Would appreciate some feedback on the following impl choices: I would like to support arbitrary ng-x validation attributes that work with input[text] https://docs.angularjs.org/api/ng/input/input%5Btext%5D. Seems like the most elegant way to do so would be to restrict: 'A' the directive, and leverage ng-model, so that as client programmer I could enable this directive participate in AJS form validation and form name=myForminput name=foo type=text ng-model=foo required ng-pattern= editable/form ...can call scope.myForm.foo.$valid However, I think that won't work because I can't specify a directive template (or templateUrl) with an input since that element cannot have children. *So I must use restrict: 'E', right?* (Unless I ditch the template and instead provide a compile() fn that appends template DOM to input, but that would be harder to maintain)? So now I have an element directive: editable name=foo ng-model=foo required ng-pattern=/editable and associated template: ng-form name=innerForm ng-show=edit input type=text /ng-form a ng-show=!edit ng-click=edit=true But now I have to enable support input[text] validation attr support on editable. One way to do so would be by copying attributes from editable onto the inner input in directive's compile() fn ie: editable name=foo ng-model=foo e-ng-pattern=/expr//editable ...would produce the following template: ng-form name=innerForm ng-show=edit input type=text ng-pattern=/expr/ /ng-form a ng-show=!edit ng-click=edit=true ...by having compile() find attributes with 'e-' prefix and replicate them on inner input.* Is there a more elegant approach? One where I could somehow stick with attribute directive (on input)?* thanks -nikita -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Separating functionality of a directive?
I agree to separate them out into separate directives, which makes then easier to manage and makes them portable. Making them all work together may be a bit trickier, but it can be done. I have several directives used for inputs to add the functionality I need, like: select-on-focus (selects any text entered when given focus) focus-on-show (puts the focus on an element that was hidden but then is shown because of other UI interactions) tab-to (watches keys for Tab or Enter and moves focus to another element) typeahead (based of ui-boostrap's typeahead with some custom functionality) On Wednesday, April 16, 2014 5:03:45 PM UTC-6, Ryan Zec wrote: What is the best way to separate out different core pieces of functionality? For example I have a extend component that has auto complete, tagging, and search query functionality. I would like to separate those pieces of functionality into separate directives t make it easier to change or even replacing them if needed. I remeber something being said about helper directive but never saw any actually implementations. A more details question with a code example of my initial idea is here : http://stackoverflow.com/questions/23119168/how-to-separate-functionality-of-angular-directive -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Directive Load Lazy
Sounds like you need to ensure that jquery and autocomplete plugin are loaded in your index file before angular script refernces. Why lazy load? Also, check that iElement is the full jquery reference you think it is at the time the directive loads: app.directive('ngAutoComplete', function($timeout) { console.log(enter) return function(scope, iElement, iAttrs) { console.log('iElement is ', iElement) console.log(typeof iElement.autocomplete) //when this line returns 'function' then you'll know you are on the right track iElement.autocomplete({ source: scope[iAttrs.uiItems], select: function() { $timeout(function() { iElement.trigger('input'); }, 0); } }); } }) ; On Wednesday, April 16, 2014 9:12:25 AM UTC-6, Diwan Oli M wrote: Hi , I am facing some issue in loading directive , when i use the directive i am getting error autocomplete not an function , after that identify jquery plugin not getting load before directive load , can you please give how to implement lazy load this directive app.directive('ngAutoComplete', function($timeout) { console.log(enter) return function(scope, iElement, iAttrs) { iElement.autocomplete({ source: scope[iAttrs.uiItems], select: function() { $timeout(function() { iElement.trigger('input'); }, 0); } }); } }) ; i found some code snippet from google , but that is not working function lazyLoad(){ app.directive('ngAutoComplete', function($timeout) { console.log(enter) return function(scope, iElement, iAttrs) { iElement.autocomplete({ source: scope[iAttrs.uiItems], select: function() { $timeout(function() { iElement.trigger('input'); }, 0); } }); } }) ; } $(lazyLoad) This method is called , but directive not getting intilized . can you please anyone give the solution for this -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Using a directive to prevent other directives to execute
Personally, I would approach the problem a different way all together. Trying to intercept the click and stop propagation sees hack-ish. No? Other approach ideas: - put a flag on rootScope defining whether the user is logged in or not and reference it in the logic functions like ng-click or ng-disabled - use a service in your controller that checks user logged in state and call this function in any method on your scope (same as above but service function instead of scope flag) - create your own directive in place of ng-click: div user-click=myAction()Do it !/div app.directive('userClick', function() { return { priority: -100 restrict: 'A', link: function(scope, element, attrs) { element.bind('click', function(e) { if(!isRegistered()) { //do something for logged out user } else{ //call function on parent scope scope.myAction(); } }); } }; }); On Wednesday, April 16, 2014 2:22:36 AM UTC-6, Michel Parpaillon wrote: Hi everyone, I already post this issue on Stack Overflow but nobody seems to be able to help me. So here I am. Some actions in my Angular app require the user to be registered. If the user is not, we want to show him a Register modal and prevent the original action. Those actions can be triggered via ng-click or any other click binding directive (for example the 'modal-toggle' one). So I found this solution: http://stackoverflow.com/a/16211108/2719044 This is pretty cool but only works with ng-click. I first wanted to make the terminal property of the directive dynamic but couldn't manage to do it. So the idea was to set terminal to true and manually prevent default click action in the directive. Here is my DOM: !-- This can work with terminal:true and scope.$eval(attrs.ngClick) (see example above) -- div user-needed ng-click=myAction()Do it !/div !-- This doesn't work. I can't manage to prevent the modal-toggle to be executed -- div user-needed modal-toggle=my-modal-id-yeyShow yourself modal !/div And my directive(s) (which don't work...) // First try (with terminal:true) app.directive('userNeeded', function() { return { priority: -100, terminal: true, restrict: 'A', link: function(scope, element, attrs) { element.bind('click', function(e) { if(isRegistered()) { // Here we do the action like scope.$eval or something } }); } }; }); // Second try (with stopPropagation) app.directive('userNeeded', function() { return { priority: -100 restrict: 'A', link: function(scope, element, attrs) { element.bind('click', function(e) { if(!isRegistered()) { e.stopPropagation(); } }); } }; }); ...And that's why I'm here. Any idea ? Thanks a lot. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: view controller $scope.$on watch function not working...
This could be a timing thing. Are you sure your listener ($scope.$on) in client controller is loaded at the time of the broadcast? Another console.log just before the registration may help you see if that's the case. I don't believe that main as parent would override the child controllers handler, but I have had it happen in one of my directives you can verify by commenting out the one in main to double check. On Thursday, April 17, 2014 7:53:56 PM UTC-6, Billy Figueroa wrote: Hi All, so I have a quick issue with my controller ordering I guess. I have the following shell page layout... html head/head body ng-controller=MainController div ng-view/div /body /html I have an ng-view template that the routeProvider is loading (account.php) when we hit the url and load ClientController... .when('/client/:user_id/account', { templateUrl: '../MINT/views/account.php', controller: 'ClientController', restrict: true }) I also have an AuthFacotory factory where, once a user logs in and I get data back from my backend (PHP) I broadcast a signal to say we are authenticated if (phpData.account_type === 'client') $rootScope.$broadcast('clientAuthenticated', phpData); else $rootScope.$broadcast('providerAuthenticated', phpData); I have the following I guess watches both inside the MainController and ClientController -- MainController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[MainController]); }); -- ClientController -- $scope.$on('clientAuthenticated', function(phpData) { console.log(We caught the broadcast for clientAuthenticated[ClientController]); }); I am only catching the one in the MainController. Based on the structure being that the ClientController is loaded as part of the view, I m guessing its some sort of a child of the MainController but why is it not catching that broadcast? the weird part is that I have other code in the ClientController and that gets executed but the console.log inside the scope statement is not I wanted to create a jsfiddle or plunker but I rarely get them working when I try to do it in a non global modular way like real apps are written i.e. var myApp = angular.module('myApp', []) -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Advice hooking things up
I have a degree in CS (not that comparing penis sizes here matters :), but Javascript is a different beast. If you want to use arrays like dictionaries (which we don't call them that in js - sounds like python), be sure to understand that an email address as an index is not a great idea. Here's something to consider: var data = { user: { name: 'bob' } } you can access object values with dot syntax as well as array/dictionary syntax: data.user.name == data['user'].name == data['user']['name']; //true On your nested ng-repeats, it's going to be a challenge to reference the detached monologues by an index of the email address from the user object (not impossible). At the least I would keep it simple by using another way to reference monos belonging to the user. good luck! On Fri, Apr 4, 2014 at 9:30 AM, Sander Elias sanderel...@gmail.com wrote: Hi, My data structures might be hard to understand, but I've had graduate level coursework in data structures and a master's in applied math. Your suggestion regarding another way of structuring the data makes sense, but given your restructuring, I don't yet see confusion regarding data structures in having a list of users and a hash of lists of monologues on a per-user basis. Wow, you must be crazy smart ;) You did: angular.extend($scope, data); that means your merged your data into your scope right? It seems to me then you need to do this: div ng-repeat='user in users' div ng-repeat='monologue in monologues[user]' But then again, what do I know. Regards Sander -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/8xN-TP_EIpc/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Extending a directive
Yes you can use another directive to do it, but timing of the wijmo directive's rendering is the challenge. You'd have to create a $watch function do you know when their directive has created the element and then modify it with jquery in your directive. Does that make sense? On Thu, Apr 3, 2014 at 1:59 AM, scarlatine arnaud.petitevi...@gmail.comwrote: Hi, Thanks for your answer. It seems strange that if I have a directive there is no way to modify the generated HTML added to the DOM using another directive or anything else. I think there are use cases where you want to add or remove some HTML tags generated by a directive that you cannot or don't want to modify. Bye... P.S.: The jQuery solution was the answer from the guys at Wijmo. But I would like to find an elegant way to use it. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/tfG9VDpHQeg/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Angular way for disabling an option in a combo
I was able to get it done with a solution on SO: http://stackoverflow.com/questions/16202254/ng-options-with-disabled-rows On Thursday, April 3, 2014 10:31:28 PM UTC-6, Sander Elias wrote: Hi Santiago, Sure!. If you build a plunk, I will take a look at it. I don't believe it can be done via ngOptions. Regards Sander -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Factory function executing with out form submit
Not sure why you are using type=submit here since ultimately your are going to authenticate via $http but, that issue aside, you are setting your login to the result of calling the authenticate function hence as soon as the controller is loaded it is executing the function. Try this: http://plnkr.co/edit/S2on4K4AxMNGYERCiiwk?p=preview On Thursday, April 3, 2014 8:42:53 PM UTC-6, Billy Figueroa wrote: Hi this is a bit of a weird error. I m hoping someone can help me. I am working on an auth service where I want to authenticate a user once they submit their form. For some reason the code is executing with out me submitting the form Here is the plunker http://plnkr.co/edit/xZ74qGbitXmpYxqsbCm2 You can see in the index.html file I have the form with the ng-submit directive to call the login function in the Controller which injects my AuthFactory service. If you run the plunker and look at the console you will see that it displays the login data... Object { username=Username, password=Password} from this line in the auth service... console.log(loginData); Please help me understand why this code is executing with out me submitting my form. I only want this code to execute when I submit my form I do understand a bit how promises work so I am not sure if the problem lies there or its something else. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Advice hooking things up
I have to admit, it's hard to follow what you are trying to do. Have you spent much time understand Javascript object notation (JSON)? It looks like the core of your difficulty is understanding effective data structures. Also, if you can create a plunker to demonstrate, that makes it easier for the rest of us to see your issue and provide examples of how we might approach the task. Using ng-repeat is great with arrays, and though it can be used on objects as well, I'd recommend sticking with arrays. So, based on your original post (with a little cleaning up), I'd have my data structured like this: $scope.data ={ users = [ { 'name': 'Bob', 'email': 'some...@somewhere.com', monologues: [ { user_id: '001' , text: 'Some text for the monologue', timestamp: '0.0' /./not sure how you are creating a Date from this - if you need it to be a new Date() then loop through data and do it before binding to scope }, { ... more objects matching structure above... } ] } ] } div ng-controller='OutputController' div ng-repeat='user in data.users' div ng-repeat='monologue in user. monologues' span class='text' ng-bind='monologue.text'/span span class='timestamp' ng-bind='monologue.timestamp'/span /div /div /div Hope that gives you some direction. On Thursday, April 3, 2014 1:31:09 PM UTC-6, Christos Jonathan Seth Hayward wrote: To ask a slightly more focused question: At present my data is being sent as {monologues: {jonathan...@pobox.comjavascript:: [[False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], ...] }, users: [jonathan...@pobox.com javascript:]} On SO someone suggested I have something that looks like [{monologues: {... etc etc ...}}]. Is my data structured appropriately for the repeater? I want to send a dictionary containing a list of strings [perhaps email addresses] for a key of users, and a hash mapping strings [perhaps email addresses] to lists for monologues. Does my approach make sense, and/or can I appropriately modify either my repeaters and/or the JSON data so that the page will read a list of email addresses, and then look up lists of lists for each email? On Thu, Apr 3, 2014 at 10:56 AM, Christos Jonathan Seth Hayward christos.jon...@gmail.com javascript: wrote: I have something that should be showing a lot of data that is not showing any data. In my HTML I have: div ng-controller='OutputController' div ng-repeat='user in data.users' div ng-repeat='monologue in data.monologues[user]' span class='text' ng-bind='monologue.text'/span span class='timestamp' ng-bind='new Date(monologue.timestamp).toLocaleString()'/span /div /div In my JavaScript I have: var repeatEr = function(data, status, headers, config) { var interval = 1000; angular.extend($scope, data); In the data being sent to my page I have: {monologues: {jonathan...@pobox.com javascript:: [[False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], [False, 0.0], ... }, users: [jonathan...@pobox.com javascript:]} What is happening is that it is displaying empty results. What I intend for it to do is to pull the Ajax data it is pulling, and then display the text (False here) and timestamps in successive DIV's. Given the data as I have it, what should I be doing with the repeaters so that it is displaying results accordingly? --Or-- Given the repeaters I have, what should I be populating as data so that the repeaters will have what they need? Thanks, -- [image: Christos Jonathan Seth Hayward] http://jonathanscorner.com/ Christos Jonathan Seth Hayward, an Orthodox Christian author. Amazon / Kindle http://amazon.com/author/cjshayward • *Author http://cjshayward.com/* • Author Biohttp://jonathanscorner.com/author/ • *Email javascript:* • Facebookhttp://www.facebook.com/christos.jonathan.hayward • Fan Page http://fan.cjshayward.com/ • Google Plushttp://jonathanscorner.com/plus • LinkedIn http://www.linkedin.com/in/jonathanhayward • *Professional http://jonathanhayward.com/* • Twitterhttp://twitter.com/JonathansCorner • *Web http://jonathanscorner.com/* • What's New?http://jonathanscorner.com/ If you read just *one* of my books, you'll want *The Best of Jonathan's Corner http://www.amazon.com/dp/1478219912*. -- [image: Christos Jonathan Seth Hayward] http://jonathanscorner.com/ Christos Jonathan Seth Hayward, an Orthodox Christian author. Amazon / Kindle
[AngularJS] Re: giving $get,$update,$query when iterating JSON object at client side;.
Any time you use for in you will get every property including prototype methods and properties of an object (arrays are still objects). To avoid this, use hasOwnProperty: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty for (var item in items){ if (items.hasOwnProperty(item) ){ . your code here . } } On Thursday, March 27, 2014 4:50:46 AM UTC-6, Deeksha Sharma wrote: Hey all, I am calling a web api from angularjs and iterating the JSON object but at the time of iteration .It is giving some unexpected terms like $get,$update,$remove etc. How can I resolve this problem. $scope.Customers=customerService.getCustomers($scope.limit, $scope.offset).$promise.then(function (data) { alert(data); for (var index in JSONData[0]) { alert(index); if (index != AddressDetail) { row += index + ','; } if (index == AddressDetail) { for (var indexx in arrData[0][AddressDetail]) { if (indexx == addressDetailId) { continue; } row += indexx + ','; } } //alert(index); } -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Can anybody tell me about the callback methods in angularjs.
They are called promises. http://docs.angularjs.org/api/ng/service/$q On Thursday, March 27, 2014 4:33:56 AM UTC-6, Deeksha Sharma wrote: -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: persistence with routing
I agree with Antonio. You are going to shoot yourself in the foot putting everything on $rootScope even though it will seem easier to start. Services are the way to go, period. It took me awhile to realize what Antonio and others are saying: your model should be in your services not on the $scope in the controller. It will make sense in the long run. But if you must learn the hard way, try it on $rootScope first. Though you will probably get it to work, once your application is big enough, it will be much more problematic to manage. On Thursday, March 27, 2014 12:50:38 AM UTC-6, Antonio Fernández Porrúa wrote: 1. The values are not copied, just referenced. 2. You should not use your scope as your model, and you do not need to. Put in the scope only the things needed in the view, neither more nor less. This way there are less values to check. 3. Your service could be just a javascript empty object, where you store anything you want. angular.module(foo).service('bar',function(){ return this; }); Then in your controler If(bar.baz === undefined){ bar.baz = $scope.baz } $scope.baz = bar.baz If baz is an array or an object this will work fine, so you can use an object to store strings and numbers -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: ngInclude crash when file not exists
Actually, I've had similar issues. In my case, if your 404 page also loads a template that still requests the same ng-include reference, then it gets stuck in a loop and will crash the browser. It's not necessarily the fault of angular but it would be nice if the ng-include directive knew that it was loading a partial and instead of falling back to the $routeProvider's 404 method, would instead just fail or show a custom message. On Wednesday, March 26, 2014 11:32:04 AM UTC-6, ev...@vfiles.com wrote: This is not the place for questions like this. idk what your issue is (you did not describe it or post an example...), but you should be blaming your own code, not ngInclude -- ngInclude in isolation will NOT crash the browser on 404 -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: changing scope of other elements
I agree with ev, that your problem is that you are creating a new scope for each button. Using the Controller As syntax should help with scoping. Ev, maybe you could be a little more tactful in your replies? Some questions are simple enough to not require plnkrs and being an open forum it's preferable to foster a welcome environment. On Wednesday, March 26, 2014 11:19:17 AM UTC-6, ev...@vfiles.com wrote: You should make a plunkr/jsfiddle before posting here. You are to be creating a scope and controller for each button and setting scope.selectedButtonId on each individual scope instead of on a parent scope, thus never overwriting the previous selectedButtonId. Your template should look like this instead, with a single parent controller: div ng-controller=ButtonsCtrl as ctrl button ng-class={ selected: button.id == selected } ng-repeat=button in buttons ng-click=ctrl.select(button) ng-bind=button.label/button /div and your controller module.controller 'ButtonsCtrl', ['$scope', ($scope) - select: (btn) - $scope.selected = btn.id ] On Tuesday, March 25, 2014 5:09:18 PM UTC-4, Josh Stratton wrote: I'm trying to implement a little demo of buttons, where I can eventually move between buttons using the arrow keys. I'm a little confused about the scoping though. On my controller I define an array of buttons I add to the scope. I iterate through this array in the html. button class=button ng-class={ selected: button.id == selectedButtonId } ng-click=toggleSelection() ng-repeat=button in buttons ng-controller=ItemController {{ button.label }} /button I also set a selectedButtonId in that main controller, which keeps track of which button is selected. I set this to the first button label. When I load the app, the first button is highlighted as I would suspect because selectedButtonId is the id for that button. When I click on another button, it calls toggleSelection() in the ItemController and updates selectedButtonId. This causes the new button to be highlighted. $scope.toggleSelection = function() { $scope.selectedButtonId = $scope.button.id; }; My problem is none of the other buttons are unhighlighting. I figured that since I was changing $scope.selectedButtonId, it would cause all the buttons to change based on selectedButtonId. I'm obviously not understanding scope correctly. When I set selectedButtonId in the ItemController does that suddenly become unique to the scope of that button and I haven't really changed it for all the other buttons? Or have I modified it in the global or parent scope, but the buttons haven't been told to reevaluate their class? I've tried calling $scope.$apply() to make it update the other buttons, but this causes an error because the event is called from an angular context and should already be updated. What am I misunderstanding? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: giving $get,$update,$query when iterating JSON object at client side;.
That works to... just be aware of for-in and prototype properties. toJson uses the hasOwnProperty or similar in converting. On Fri, Mar 28, 2014 at 7:07 AM, Deeksha Sharma deeksha.sharma2...@gmail.com wrote: Hey Luke Kende, thanks for your suggestion ,I did it by using angular.toJson. Thank u once again. On Fri, Mar 28, 2014 at 11:39 AM, Luke Kende luke.ke...@gmail.com wrote: Any time you use for in you will get every property including prototype methods and properties of an object (arrays are still objects). To avoid this, use hasOwnProperty: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty for (var item in items){ if (items.hasOwnProperty(item) ){ . your code here . } } On Thursday, March 27, 2014 4:50:46 AM UTC-6, Deeksha Sharma wrote: Hey all, I am calling a web api from angularjs and iterating the JSON object but at the time of iteration .It is giving some unexpected terms like $get,$update,$remove etc. How can I resolve this problem. $scope.Customers=customerService.getCustomers($scope.limit, $scope.offset).$promise.then(function (data) { alert(data); for (var index in JSONData[0]) { alert(index); if (index != AddressDetail) { row += index + ','; } if (index == AddressDetail) { for (var indexx in arrData[0][AddressDetail]) { if (indexx == addressDetailId) { continue; } row += indexx + ','; } } //alert(index); } -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/nkTcNKpd9cA/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/nkTcNKpd9cA/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Don't reload page when browser back button is pressed
Yes, this is one of the challenges I ran into with routing and angular. Anytime the route changes, the controller and the template are loaded anew. I think we expect angular to behave like cached pages when users hit the back button and it's just there, but it's not the same context with deep linking. A couple of ideas: 1. Don't put the item page in a new route, just ng-hide/ng-show what you want on click and give user a back button so they don't use the browser back button. 2. Store your list items so that they are not reloading from ajax and the back button will still re-render them very quickly. On Wednesday, March 19, 2014 1:36:38 PM UTC-6, Pushpendra Kumar wrote: Hello, I have a list page and on click of any list item i go to show page. Now if I press browser back button then list route called and re-render the list page. But I don't want this. I want that on pressing browser back button previous page should be seen without reloading it. Can we hide it while we are going to show page and when come back then show this? Please suggest me the trick. List Page show page list page(but it should not be reloaded) - browser back button Regards, Pushpendra -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Analyzing and modifying object property from $http on the fly with AngularJS
Why wouldnt you just call the url with the artist name using the replace function? It won't affect the original value. $http.get('http://ws.audioscrobbler.com/2.0/?method=album.getinfoapi_key=e8aefa857fc74255570c1ee62b01cdbaartist=' + $scope.artist.name.replace(',the', '') + 'album On Wednesday, March 19, 2014 7:31:25 AM UTC-6, Eric Mitjans wrote: I have two $http queries linked together. The first gets an artist name from a 3rd party API, and then with AngularJS I fill the query URL from the second $http query, that will get cover art from *another* 3rd party API. The problem i'm finding, is that when searching for an artist name starting with THE (for instance The Smiths), the first API will respond with Smiths, The, which won't be recognized by the second API as artist name. Being so, is there some way to act upon the case that the artist name received ends with *, the*, and changing it back before parsing it into the second $http query? Is that even possible? Here's the relevant code: $scope.getDetails = function (id) { $http.get('http://api.discogs.com/artists/' + id). success(function(data) { $scope.artist = data; }); $http.get('http://api.discogs.com/artists/' + id + '/releases?page=1per_page=12'). success(function(data2) { $scope.releases = data2.releases; }); $scope.clicked = true; $scope.sliding = true; }}function ImageCtrl($scope, $http) { $scope.image = 'img/record-default.png'; $http.get('http://ws.audioscrobbler.com/2.0/?method=album.getinfoapi_key=e8aefa857fc74255570c1ee62b01cdbaartist=' + $scope.artist.name + 'album=' + $scope.release.title + 'format=json'). success(function (data4) { $scope.image = data4.album.image[2]['#text']; } );}; -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] How to get values from ng-model array into input
The fact that the input has name=Tags is irrelevant. selected_item.Tags existed in his object as an array, like, $scope.selected_item = { Tags: [ 'tag1', 'tag2', ... and so on ] } hence selected_item.Tags points to the array On Wednesday, March 19, 2014 7:10:50 AM UTC-6, Michel Morelli wrote: Il giorno 19/mar/2014, alle ore 06:29, Luke Kende luke@gmail.comjavascript: ha scritto: Ok, so you've got selected_item bound to ng-model and it is an object with a property of Tags that points to an array. Instead of trying interpolation on the value attribute of the input, make the input use ng-model and update the value when the selected item changes with ng-change. This is the more angular way of doing it. select ng-model=selected_item name=select id=gallery_list ng-options=v as v.Title for (k, v) in Items ng-change=updateTags()/select input type=text name=Tags ng-model=selectedTags placeholder=Tag, Tag 2/ //in the controller $scope.selectedTags = null; $scope. updateTags = function(){ $scope.selectedTags = $scope.selected_item.Tags.join(); //join() creates a comma separated string of values from the array } Hi, can you explain the last line ? I don’t understand $scope.selected_item.Tags. Ok for $scope, but “selected_item” is the ng-model of select while “Tags” is “name of “input text”. Thanks. M. -- Davide Morelli ziob...@gmail.com javascript: -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Don't reload page when browser back button is pressed
Yes, I suppose there are some tricks: http://stackoverflow.com/questions/15813850/detect-history-back-using-angular On Thursday, March 20, 2014 12:43:37 PM UTC-6, Sander Elias wrote: Luke, Pushpendra, If you switch to html5mode, you gain (some) control over the back-button. This enables the use of the history apihttp://diveintohtml5.info/history.html However, this works only well in evergreen browsershttp://tomdale.net/2013/05/evergreen-browsers/ tough. no IE10 (perhaps even 11) Regards Sander -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Autocomplete, which one ?
I'd use Angular UI Bootsrap's Typeahead (same thing as autocomplete) plus you get the other ui tools that go with it. http://angular-ui.github.io/bootstrap/#/typeahead On Thursday, March 20, 2014 10:32:51 AM UTC-6, Michel Morelli wrote: Hi all, I have see that there are 10+ way to manage an autocomplete. In my case I have (in $scope) a list of city (with their id) to use for autocomplete. But I don’t understand which directive I can use. There is “Macgyver” version, one founds in jsfiddle (http://jsfiddle.net/sebmade/swfjT/light/), one that use dataset tag (https://coderwall.com/p/0lms3g), and much more. Can some1 advise me a good, little but useful autocomplete directive that get “the possible choices” from $scope and update an input tag when User make his choice ? Thanks for all. M. -- Davide Morelli ziob...@gmail.com javascript: -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: how to minimize Controller dependencies
If you have so many services/factories being injected, I have to wonder what the controller looks like, meaning, are you doing too much in one controller where somethings could exist in a directive (like elements you use elsewhere)? Also, if you some of these services (not resolves) are so common that you use them in almost every controller, you could move them to one service, or create a combined service that gets injected with all that are common and just returns a single object reference to each service, if that makes sense. The thing that sticks out the most is how many resolves you are doing. Personally, I don't use resolves at all because they can slow the load of my controllers and therefore the UX. (But I am not using ui-router either) There are some approaches to getting initial data for the app if these resolves are not needed to run but once on first load of the app. There are also ways to get the data once inside the controller, without resolves, and only show the UI view you want to show after the data is retrieved. I can expand on this option more if need be. I know, not great answers but just thinking it out with you. On Tuesday, March 18, 2014 8:12:21 AM UTC-6, Jideobi Ofomah wrote: i currently have a controller as follows: .controller('AddNewInventoryCtrl', function ($q, $scope, $filter, $stateParams, currentFacility, storageService, $state, inventoryFactory, productTypes, programs, uomList, facilities, batchFactory, currentFacilityStorageUnits, $translate) { //controller implementation here } these are factories or services injected: $q, $scope, $filter, $stateParams, storageService, $state, inventoryFactory, batchFactory, $translate. while these: ( currentFacility, productTypes, programs, uomList, facilities, currentFacilityStorageUnits ) are collection of data resolved at add new inventory ui-router config inside resolve{ } -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Filtering on a filtered value?
Well, there's probably be a better way (and I was typing this as Sander answered), but the first thing that comes to mind is to inject $filter service into your controller and set person.BirthDate to the formatted value (or use another field altogether if you need to keep reference to the original): function MyCtrl($scope, $filter){ var angularDateFilter = $filter('date'); angular.forEach($scope.contacts, function(contact){ contact.BirthDate2 = angularDateFilter( contact.BirthDate, 'medium' ) }) } pFilter by Name: input type=text ng-model=contactsfilter.Name//p pFilter by BirthDate: input type=text ng-model=contactsfilter.BirthDate2//p ul li ng-repeat=item in contacts | filter: contactsfilter div{{person.FirstName}}/div div{{person.BirthDate | date:medium}}/div /li /ul On Wednesday, March 19, 2014 8:57:03 PM UTC-6, Moab wrote: Looked around and couldn't find an answer for this, possibly because I'm not sure what this would be referred to - filtering on a filtered value? I've got a collection rendered in a simple list using ng-repeat similar to the following: -- script $scope.contacts = [ {Name: George, BirthDate: 01/15/1940}, {Name: John, BirthDate: 02/15/1940}, {Name: Ringo, BirthDate: 03/15/1940}, {Name: Paul, BirthDate: 04/15/1940} ]; /script pFilter by Name: input type=text ng-model=contactsfilter.Name//p pFilter by BirthDate: input type=text ng-model=contactsfilter.BirthDate//p ul li ng-repeat=item in contacts | filter: contactsfilter div{{person.FirstName}}/div div{{person.BirthDate | date:medium}}/div /li /ul -- The textbox filter for Name works great, and so does the filter for BirthDate if I enter 1 for instance. But if I enter Jan of course, the resulting rendered list is empty because it's filtering the original column value of 01/15/1940, not the filtered output of Jan 15, 1940 that is rendered in the column. So I'd like to be able to bind the textbox filter to the output of the the filtered date column and have it include or exclude the array item. Any ideas - am I missing a simple way to configure this? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: trouble using JavaScript pseudo-classes in an Angular Service defined using a factory method
Yep, javascript has a learning curve when coming from other programming languages. I'm not claiming to be an expert but I understand a thing or two, so maybe can offer some direction. It's hard to follow what you are after completely, but I'll try. First, you are reading and trying things from the tutorial, so good job. You are headed down the right path. Second, 'pseudo class' is a reference to css classes, not javascript. It looks like you are actually asking about using a javascript as OO and using a function to define the class. Glad you recognize the difference between a json object and a class defined object. Now, your factory is returning the json defined from the object notation using curly braces. Since a factory only returns what the function returns, when you inject it into the controller, what you see is what you get. return { somevariable: 'string value', somefunction: function(){ return 'Im a function!' } } If this is what your nodeService returned then these 'named' references are available as dot notation or array notation from nodeService: console.log(nodeService.somevariable); //string value console.log(nodeService['somevariable']); //string value var result = nodeService.somefunction(); console.log(result); //im a function As you have it, if what you are really after is a new Node instance from the factory, then you can just call it in the controller: var myNode = new nodeService.Node({ message: 'its a trap!', isNode: true }); console.log(myNode.node_data.message); //its a trap! It doesn't matter that the nodeService also exposes other properties and functions. If you want only one instance from the factory, you could define the function above your return statement in the factory and new it in the return statement: ..other service stuff... function Node(data ){ ...your function stuff... } return new Node({ message: 'its not a tumor', isNode: true }); then in controller you would have: console.log(nodeService.node_data.message);//its not a tumor There's a lot flexibility in how to go about what you are after. Hope I offered some insight. On Wednesday, March 19, 2014 4:35:41 PM UTC-6, Doug Snyder wrote: I'm new both to AngularJS and JavaScript and probably most people learning Angular have more JavaScript experience than I do. I'm trying to use a simple JavaScript pattern for creating pseudo classes using JavaScript funcitons that I've learned with a pattern for Angular services from the Angular docs. Sadly they don't go together and I am left baffled since I don't understand enough about the internals of JavaScript that seem to govern the hackish seeming ( to me ) nature of either of these patterns to trouble shoot it myself. But I'm gathering that there must be a fairly easy way to have pseudo classes in Angular that most people probably don't see the need to explain. So my pseudo class looks like this: function Node( data) { this.node_data = data; this.status = 'NEW; this.doSomething = function (param) { if (param == 'SOMETHING') return RESULT1; else return RESULT1; }; this.getCSSClass = function() { if (this.status == NEW) return 'new'; else return 'old'; }; }; so can pass parameters to a pseudo constructer and my class fields and methods can be accessed under this this works fine for me when I use it in a controller. In angular there are multiple patterns to implement a controller, but I am using this: myApp.controller('NodeCtrl', ['$scope','$rootScope' ,function($scope, $rootScope) { $scope.some_var = null; $scope.someScopeMethod = function() { console.log('scope did something'); }; function Node( data) { this.node_data = data; this.status = 'NEW; this.doSomething = function (param) { if (param == 'SOMETHING') return RESULT1; else return RESULT1; }; this.getCSSClass = function() { if (this.status == NEW) return 'new'; else return 'old'; }; }; $scope.someOtherScopeMethod = function() { console.log('scope did something else'); }; }]); So $scope holds the scope for my Angular related stuff and I have class whose scope is referenced by this within the class This works fine, its when I want to repeat this class pattern with in a service instead of a controller that I get lost: There are various patterns for a service but I am using this factory method: myApp.factory('nodeService', function($rootScope) { var my_service_var1 = null; var my_node_list = []; return { aServiceMethod: function(param) { console.log('doing something in my service'); }, Node:function(data) { this.node_data = data; this.status = 'NEW; this.doSomething = function (param) { if (param == 'SOMETHING') return RESULT1; else return RESULT1; }; this.getCSSClass = function() {
[AngularJS] Re: Angular for responsive, sending viewport size with rest queries?
Well, based on how the question points are posed, it doesn't sound like you quite have a grasp of angular, but I will offer some direction. - First, go through the main tutorial if you have not done so: http://docs.angularjs.org/tutorial - Used as a single page app, angular uses partials when switching views that are retrieved via XHR not via RESTful API. To do this, review the use of ng-router and ng-view. One you've set up your routes via $routeProvider, then angular will handle loading the different views. If you need nested views and states then you might look into to ui-router. http://scotch.io/tutorials/javascript/single-page-apps-with-angularjs-routing-and-templating https://github.com/angular-ui/ui-router - Using less/compass is no problem, but irrelevant to angular really. - Instead of sending viewport size to your api, I'd recommend reading up on css media queries or simply loading a different index.html file based on the device requesting the page. Personally, I do not know of any CMS's using angular. The server is agnostic, so it does not really matter, but there are some good seeds to start with based on using NodeJs. Here's a link I found that list a few: http://www.jquery4u.com/angular-js/5-angular-js-seeds-bootstrap-apps/ Good luck! On Monday, March 17, 2014 2:55:33 PM UTC-6, Iain Duncan wrote: Hi folks, I'm planning on using Angular for a lightweight responsive CMS in which content is grabbed from a ReST service, likely implemented in Flask or Pyramid. What I want to do specifically is: - use Less/Compass/Susy on the front end - have Angular get page content via rest queries - have Angular sent the current viewport/display size to the back end with the content queries so the backend can optionally return different content for the phone factor Before reinventing the wheel I thought I'd ask if there is already a common documented way of doing this. Pointers to online resources welcome too. Also would be interested in pointers to any CMS projects for doing that. I normally use Python but would be interested in being able to backend with Ruby (or even PHP) as well in case I can't sell the client on being able to host Python. thanks! Iain -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: How to get clean mark-up using Angular conditionals
And for the sake of consistency/readability why not use ng-style instead of interpolation on style attribute? (Forgive me since I have not seen this syntax before { [ { } ] } ) i ng-click=showHideGroup(row) ng-class=getToggleIcon(row) class=treeToggle *ng-style=getPadding(row)* /i Another thing I'd mention here is related to performance. If your within an ng-repeat on a lot of rows and your scope functions are heavy, this approach can really degrade the performance of the app. You might maintain state directly on the row object instead from the ng-click function: $scope.showHideGroup = function(row){ row.isOpen = !row.isOpen; //toggler if (row.isTreeNode){ row.padLeft = 'padding-left: 10px'; row.iconClass = row.isOpen ? 'minus-sign' : 'plus-sign'; } else { row.padLeft = 'padding-left: 20px'; row.iconClass = 'dot-symbol'; } } i ng-click=showHideGroup(row) ng-class=row.iconClass class=treeToggle ng-style=row.padLeft /i The result will be that the digest cycle will not be executing your functions every time a property on scope changes but instead only when an actual click is performed. I know this goes beyond your original question, and I'm sure Sander will correct me if I am wrong, but I have found this approach of getting functions off of my scope to be better practice for performance. On Monday, March 17, 2014 2:38:04 PM UTC-6, William Huster wrote: As a courtesy to anyone who might stumble across this post. Here's my final implementation: i ng-click=showHideGroup(row) ng-class=getToggleIcon(row) class=treeToggle style=padding-left: {[{ getPadding(row) }]}px; /i I opted to use fontawesome icons instead of '+' / '-' / '.' as content inside of a div. The logic and icon class definitions were moved out of the template and into the getToggleIcon() function on scope. William *--* *William Huster* m1 | (202) 255-8444 m2 | (317) 709-3425 On Mon, Mar 17, 2014 at 3:43 PM, William Huster whus...@gmail.comjavascript: wrote: Even better! This makes for even cleaner compiled DOM that doesn't have those ng-if comments. Thanks. On Monday, March 17, 2014 3:27:03 PM UTC-4, Sander Elias wrote: Hi, You should really do this a whole lot more dry! div ng-click=showHideGroup(row) style=padding-left: {[{ getPadding(row) }]}px; {{ row.children ? row.expanded ? - : + : . }}} /div` regards Sander -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/W2MoRfpZEs0/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com javascript:. To post to this group, send email to ang...@googlegroups.comjavascript: . Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Destroying directives used in a ngRepeat
It doesn't sound like the directive is the issue, but the object data in the array bound to ng-repeat. I have a page that uses angular-ui-bootstrap's pager and the only items on the scope are the ones for the current page, hence I do not have this issue. What is the checkbox binding ng-model? That is what you need to manage on paging, turn off any that aren't on the current page. Make sense? On Monday, March 17, 2014 5:06:20 AM UTC-6, Johan Smolders wrote: I have a inbox kind of view which uses a ngRepeat. Inside every row is a directive I created to mark the row (checkbox). The problem is that when I use pagination and update the source of ngRepeat in every step the directives that are created in on every page aren't destroyed. This means if you check on box on page one, one on page two and one on page three AngularJs thinks 3 items are selected. How do I destroy directives once they aren't shown anymore? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: How to get values from ng-model array into input
Ok, so you've got selected_item bound to ng-model and it is an object with a property of Tags that points to an array. Instead of trying interpolation on the value attribute of the input, make the input use ng-model and update the value when the selected item changes with ng-change. This is the more angular way of doing it. select ng-model=selected_item name=select id=gallery_list ng-options=v as v.Title for (k, v) in Items ng-change=updateTags()/select input type=text name=Tags ng-model=selectedTags placeholder=Tag, Tag 2/ //in the controller $scope.selectedTags = null; $scope. updateTags = function(){ $scope.selectedTags = $scope.selected_item.Tags.join(); //join() creates a comma separated string of values from the array } On Tuesday, March 18, 2014 11:48:35 AM UTC-6, Maksim Go wrote: Hello, I need help with getting values from array into comma separated list. I have select tag: select ng-model=selected_item name=select id=gallery_list ng-options=v as v.Title for (k, v) in Items/select now if I need to get selected items tags with {{selected_item.Tags}} it gives me an array: {0: Test Tag 1,1:Test Tag 2} But since i need to display this list as input value, I don't know how to iterate the values in given array: input type=text name=Tags value={{selected_item.Tags}} placeholder=Tag, Tag 2/ Snippet what I have is like this: select ng-model=selected_item name=select id=gallery_list ng-options=v as v.Title for (k, v) in Items/select input type=text name=Tags value={{selected_item.Tags}} placeholder=Tag, Tag 2/ -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: ng-Routing NOT happening for simple html files without server dependency
http://stackoverflow.com/questions/19847252/cross-origin-requests-are-only-supported-for-http On Sunday, March 16, 2014 11:10:28 AM UTC-6, Rupam Dutta wrote: Yes, I found that there is a XHR exception in devtool console. The error is Cross origin requests are only supported for HTTP. I am trying to redirect to Test.html from Index.html and both files are located under same Views folder. As specified, I have used the below code in routeProvider config: $routeProvider .when('/view1', { controller: 'FirstController', templateUrl: '../Views/Test1.html' }) .when('/view2', { controller: 'FirstController', templateUrl: '../Views/Test2.html' }) .otherwise( { redirectTo: '/view1' }); }); So basically I need to change the route in HTTP protocol. How to do that, if you can help me out. Thanks, Rupam. On Sun, Mar 16, 2014 at 1:44 PM, Luke Kende luke@gmail.comjavascript: wrote: So if you load the template's url in the browser's address directly and that works, then check and see if chrome's network tab shows the xhr call. Is it a cross-domain or server issue? If there's no xhr call at all, then is ng-app firing (there should only be one ng-app in the index.html not in each file), and have you included the ng-router javascript library? On Sun, Mar 16, 2014 at 1:59 AM, Rupam Dutta dutta.r...@gmail.comjavascript: wrote: Yes, I have used ng-view to load the routed views dynaically in my index.html. I am unaware how to check xhr call in chrome devtools, but I will give a try. But just to reconfirm about the template path, I tried with hard-coded absolute url (just for testing) instead of relative path in my templateUrl, that also did not work. Thanks, Rupam. On Mar 16, 2014 12:56 PM, Luke Kende luke@gmail.com javascript: wrote: Did you use ng-view in your index.html file? Then you can see the XHR call in the browser's developer tools to verify the path being called to load the template. On Saturday, March 15, 2014 10:35:59 PM UTC-6, Rupam Dutta wrote: Hi folks, I am stuck in a very basic area. I was just building few Views (simple html files) having different functionality with almost every file pointing to AngularJs library. My html files are located under Views folder and angular js files (main and route) under Scripts folder. The entire stuff is developed under Dotnet MVC4 project. Every file is working FINE in such scenario when I am running the Dotnet application. Now my requirement got changed to bring out the entire project from Dotnet MVC4 and just keeping only Views and Scripts without any other Dotnet dependencies. So, surprisingly after pulling out the Views and Scripts and I attempted to run those individually, every html executed perfectly with angular implementations. But, wherever there is ng-route dependency and logic is written to route the current html to another html, that redirection is NOT happening at all. I am attaching a sample routing code herein below which is pretty simple: myApp.config(function ($routeProvider) { $routeProvider .when('/view1', { controller: 'FirstController', templateUrl: '../Views/Test1.html' }) .when('/view2', { controller: 'FirstController', templateUrl: '../Views/Test2.html' }) .otherwise( { redirectTo: '/view1' }); }); Test1.html and Test2.html contains simple text like Test1 and Test2, nothing else. I hope I could make myself clear on my issue. Any suggestions and advice will be helpful for me. Looking forward. Thanks, Rupam. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/amO2W1AYEiI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com javascript:. To post to this group, send email to ang...@googlegroups.comjavascript: . Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/amO2W1AYEiI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com javascript:. To post
[AngularJS] Re: dealing with async
Based on what I am hearing, yes, it is fact of life that you can't force execution to wait on the promise from an async call. Resolve is doing this for you anyway. If createCustomer() is returning a promise, then you can do the assignment and use the then() function: var newCust = custFactory.createCustomer(); newCust.then(function(customer){ //do some stuff with customer console.log( newCust === customer); //true }) On Sunday, March 16, 2014 8:32:48 AM UTC-6, MattB wrote: I have a custFactory service with a method called createCustomer that creates a customer model. This method uses data fetched from the server to initialize the customer model. I would like for the createCustomer method to be synchronous, so as to make the method easier to work with. Of course the method used to fetch data is asynchronous. I would like the method to look like this: var newCust = custFactory.createCustomer(); I am aware of the resolve property used in routing, but I may want to use this service in a directive, in which case there is no resolve mechanism to ensure initialization. Are there any strategies for turning a method that has an asynchronous dependency into a synchronous method call? Or is it just a fact of life that once you have introduced an async dependency into a method that that method needs to propagate the asynchronicity (via a promise or callback). Sincerely, MB -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Setting authorization headers does not seems working on mu http.get method
This may have to do with the fact the the browser will first make an OPTIONS http request without the basic auth credentials. If your api doesn't handle OPTIONS without the credentials, then the request fails. I ran into this issue (not with Angular but with a jQuery page where we needed basic authentication). Here's a post that illuminated it a little: http://stackoverflow.com/questions/9692067/jquery-ajax-calls-with-http-basic-authentication I could be wrong, but this is one thing to consider. On Sunday, March 16, 2014 3:29:24 AM UTC-6, Ramanand Chitravelu wrote: As given in the documentation i am trying to set a authorization header on my config $httpProvider.defaults.headers.common['authorization'] = 'Basic aG9zdDpwYXNzd29yZA=='; https://lh6.googleusercontent.com/-7irvCksgu0s/UyVu3hf6lII/Dl0/1x23CQNKKjY/s1600/Screenshot+from+2014-03-16+14%3A58%3A36.png console.log prints my header but i cant see any request header going on my chrome console. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: AngularJS options with a simple_form checkbox
Not sure about rails, but one gotcha to look out for is the dot rule. http://stackoverflow.com/questions/17178943/does-my-ng-model-really-need-to-have-a-dot-to-avoid-child-scope-problems On Sunday, March 16, 2014 7:10:55 AM UTC-6, bertly_the_coder wrote: Hi guys, I'm using AngularJS with Rails nd simple_form and would like to know how one assigns ng-model to a checkbox in simple_form? I have tried adding it like this: =f.input :super_admin , label: false, checked_value: true, unchecked_value: false, as: :boolean,:input_html={ng-model=superadmincbx} but my ng-hide does not work. %span{ng-hide=superadmincbx} I'm also using the Batarang and checking/unchecking the checkbox does not trigger the corresponding changes in the scoped item. However, in my controller, if I add $scope.superadmincbx = true; it get's picked up by the checkbox(it's checked) and ng-hide works. What am I not seeing/doing wrong? I also have a drop-down select which works as expected when I use: =f.association :survey_type, as: :select,:input_html ={ng-model=survey_type} which works fine. Thanks for your help! -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: Can Angular.js auto-update a view if a persistent model (server database) is changed by an external app?
I'm going to take a stab at this since not exactly sure what you are asking, and say yes: websockets. If something changes on the server side you can push a socket message down to the client which can react and change the view. On Monday, March 17, 2014 6:11:43 PM UTC-6, ali normukhamedov wrote: -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: ng-Routing NOT happening for simple html files without server dependency
Did you use ng-view in your index.html file? Then you can see the XHR call in the browser's developer tools to verify the path being called to load the template. On Saturday, March 15, 2014 10:35:59 PM UTC-6, Rupam Dutta wrote: Hi folks, I am stuck in a very basic area. I was just building few Views (simple html files) having different functionality with almost every file pointing to AngularJs library. My html files are located under Views folder and angular js files (main and route) under Scripts folder. The entire stuff is developed under Dotnet MVC4 project. Every file is working FINE in such scenario when I am running the Dotnet application. Now my requirement got changed to bring out the entire project from Dotnet MVC4 and just keeping only Views and Scripts without any other Dotnet dependencies. So, surprisingly after pulling out the Views and Scripts and I attempted to run those individually, every html executed perfectly with angular implementations. But, wherever there is ng-route dependency and logic is written to route the current html to another html, that redirection is NOT happening at all. I am attaching a sample routing code herein below which is pretty simple: myApp.config(function ($routeProvider) { $routeProvider .when('/view1', { controller: 'FirstController', templateUrl: '../Views/Test1.html' }) .when('/view2', { controller: 'FirstController', templateUrl: '../Views/Test2.html' }) .otherwise( { redirectTo: '/view1' }); }); Test1.html and Test2.html contains simple text like Test1 and Test2, nothing else. I hope I could make myself clear on my issue. Any suggestions and advice will be helpful for me. Looking forward. Thanks, Rupam. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: $watch an array of objects and mark which objects are dirty
Yep, you'd have to loop through to determine which was changed $watching an array. (I don't think you want to $watch each object in array, bad idea) Comparing objects isn't too difficult with angular.equals: http://docs.angularjs.org/api/ng/function/angular.equals But, I have to ask what causes the change on the object that you need watch? If it is from the ui view then you can put the call on the element and move the function on the scope: li ng-repeat=item in myArray input ng-model=item.name ng-change=doSomethingWith('name',item) /li $scope. doSomethingWith(key, item){ //now we know exactly what changed on the object and can do what we need with it console.log( 'item name is now ', item[key] ) } See: http://docs.angularjs.org/api/ng/directive/ngChange On Friday, March 14, 2014 11:42:40 PM UTC-6, Disha Shah wrote: I am kinda new to Angular JS, and am trying to figure out a elegant solution to watch each object in a array for its property changes. I know the way to deep watch an array is by: $scope.$watch(collection,function( newValue, oldValue ) { /* do something*/ }, true ); But the newValue, oldValue doesn't give away exactly which object in the array has changed. Other way I can think of is to loop the array and set a watch on each object in the array. Is there a better solution to this? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: ng-Routing NOT happening for simple html files without server dependency
So if you load the template's url in the browser's address directly and that works, then check and see if chrome's network tab shows the xhr call. Is it a cross-domain or server issue? If there's no xhr call at all, then is ng-app firing (there should only be one ng-app in the index.html not in each file), and have you included the ng-router javascript library? On Sun, Mar 16, 2014 at 1:59 AM, Rupam Dutta dutta.rupam1...@gmail.comwrote: Yes, I have used ng-view to load the routed views dynaically in my index.html. I am unaware how to check xhr call in chrome devtools, but I will give a try. But just to reconfirm about the template path, I tried with hard-coded absolute url (just for testing) instead of relative path in my templateUrl, that also did not work. Thanks, Rupam. On Mar 16, 2014 12:56 PM, Luke Kende luke.ke...@gmail.com wrote: Did you use ng-view in your index.html file? Then you can see the XHR call in the browser's developer tools to verify the path being called to load the template. On Saturday, March 15, 2014 10:35:59 PM UTC-6, Rupam Dutta wrote: Hi folks, I am stuck in a very basic area. I was just building few Views (simple html files) having different functionality with almost every file pointing to AngularJs library. My html files are located under Views folder and angular js files (main and route) under Scripts folder. The entire stuff is developed under Dotnet MVC4 project. Every file is working FINE in such scenario when I am running the Dotnet application. Now my requirement got changed to bring out the entire project from Dotnet MVC4 and just keeping only Views and Scripts without any other Dotnet dependencies. So, surprisingly after pulling out the Views and Scripts and I attempted to run those individually, every html executed perfectly with angular implementations. But, wherever there is ng-route dependency and logic is written to route the current html to another html, that redirection is NOT happening at all. I am attaching a sample routing code herein below which is pretty simple: myApp.config(function ($routeProvider) { $routeProvider .when('/view1', { controller: 'FirstController', templateUrl: '../Views/Test1.html' }) .when('/view2', { controller: 'FirstController', templateUrl: '../Views/Test2.html' }) .otherwise( { redirectTo: '/view1' }); }); Test1.html and Test2.html contains simple text like Test1 and Test2, nothing else. I hope I could make myself clear on my issue. Any suggestions and advice will be helpful for me. Looking forward. Thanks, Rupam. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/amO2W1AYEiI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/amO2W1AYEiI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: ngClass - condition when to run checks in an ngRepeat to imporve efficiency
I had a similar issue. What I did was to take the logic out of ng-class. In other words, my final ng-class only ever checked booleans, never a function: { selDate: col.isSelected, selCompDate: col.isCompSelected, available: col.isValid, inRange: col.isinRange, inCompRange: col.isinCompRange } To do this, you have to instead put the logic in a function that is called when an event happens that could change these boolean attributes. $scope.select(col){ angular.forEach($scope.row, function(value, key){ $scope.row[key].isSelected = value.cIndex == col.cIndex; //the idea, not necessarily correct code }) } Hopefully this gives you the idea. I'd be curious if others found better ways to do it, but this way the logic that sets the booleans is only called when something changes that could affect it, and ng-class on the digest cycle is not so costly. Good luck! On Sunday, March 9, 2014 3:05:52 AM UTC-6, yuval bar-on wrote: I'm working on a Date Range-Picker with a compare option (similar to the one used in Google Analytics), but I'm adding something extra - I want that when you hover over a date it would color all dates between the already chosen date and the hovered-over date, so it creates this visual drag effect. The problem is this causes a lot of overhead. You can check the entire code here http://embed.plnkr.co/tY6kfX13uovFqW6sFdZV/preview, but here's the important bit: td ng-class={selDate: isSelected(col), selCompDate: isCompSelected(col), available: col.isValid(), inRange: isinRange(col), inCompRange: isinCompRange(col)} ng-repeat=(cIndex, col) in row ng-click=select(col) ng-mouseover=hover(col) {{ cal.cal[rIndex][cIndex] | toFormat: 'DD' }}/td See that? That's a whole lot of checking to do. But the fact is, I don't need all that. i.e. every td can accept a bunch of classes - selDate, selCompDate, available, inRange, inCompRange. The first two - they only change after a click event on a td. the available? That will only change after we change the month - a click event on one of two possible th's. in other words - How can I avoid expensive DOM changes like that, and still keep that logic working? Thanks in advnace, yuvi. (p.s. I also raised the question on Stackoverflow http://stackoverflow.com/questions/22280007/angularjs-efficiency-problems-with-ngrepeat-and-ngclass, if you want to help me over there) -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
[AngularJS] Re: DOM manipulation and $compile not working
You are mixing angular scope with dom manipulation. They are two different things so not surprised you are having trouble. $scope values should point to javascript literals, objects, arrays, but not to dom elements. You can't call a jquery method without wrapping it first Try this: $scope.modif = function (e) { var temp = angular.element(e.target.offsetParent.offsetParent.childNodes[3].childNodes[(this.$index+1)*2]); temp.childNodes[11].html($compile('button ng-click=save($event)Save/button')($scope));}; On Sunday, March 9, 2014 9:48:20 AM UTC-6, François S wrote: I have un little problem with DOM manipulation. Here's my angular function: $scope.modif = function (e) { $scope.temp = e.target.offsetParent.offsetParent.childNodes[3].childNodes[(this.$index+1)*2]; $scope.temp.childNodes[11].innerHTML = $compile('button ng-click=save($event)Save/button')($scope);}; but my button is rendered like that in the document: [[object HTMLButtonElement] I know that using innerHTML with Angular is wrong but when i'm using .html() i have this error: $scope.modif = function (e) { $scope.temp = e.target.offsetParent.offsetParent.childNodes[3].childNodes[(this.$index+1)*2]; $scope.temp.childNodes[11].html($compile('button ng-click=save($event)Save/button')($scope));}; TypeError: undefined is not a function at h.$scope.modif Thanks, François -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
Re: [AngularJS] Re: Element from scope?
The link function has a reference to the element. I cannot guess at what you are trying to do, so you'll have to play around to see if you have access to what you want, where you want it. Good luck! On Wed, Mar 5, 2014 at 3:07 PM, Matt Hughes hughes.m...@gmail.com wrote: I am in a directive. Specifically https://github.com/wix/angular-tree-control/blob/master/angular-tree-control.js. It's a recursive directive as the name might suggest; it associates data with child scope. In this particular directive, it is really just element == scope. They pass the scope around to a bunch of functions and I was hoping to be able to manipulate the associated element node in the same function. Tue, Mar 4, 2014 at 1:40 AM, Luke Kende luke.ke...@gmail.com wrote: $scope is not associated with just one element if it's in a controller, and if you were using a directive, I do not think you would ask this question. No, I don't believe there's a way to access a reference to an element from a controller's $scope. This sounds like bad practice. What is it you are trying to accomplish that you believe you need an element reference from scope? On Monday, March 3, 2014 11:41:17 AM UTC-7, Matt Hughes wrote: You can get the scope associated with a given DOM element via: angular.element(foo).scope(). Are you able to do the reverse? I have the scope, but I want the element associated with it. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/YIU9uby5TuE/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/YIU9uby5TuE/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Paginated Scrolling - strange behavior of custom directive
You might look at ng-grid. Of course, I'm assuming it's implemented with scroll bars there because I know jqGrid is. Otherwise, you'll need to wrap the table in a div with set dimensions and overflow:auto. You will not keep your header a the top as the user scrolls... you can't add scroll bar to just tbody that I'm aware. On Wednesday, March 5, 2014 4:51:23 PM UTC-7, Alexandre Verri wrote: I've found the problem (with the custom filter). It's fixed now: http://jsfiddle.net/averri/764tc/10/ By the way, do you know how can we add a scroll bar to the table? Em quarta-feira, 5 de março de 2014 20h18min25s UTC-3, Alexandre Verri escreveu: Hello, I've created a directive in order to do a paginated scrolling. The intention is to do a fast pagination on huge tables. It's working fine, despite the issue with the very first rendering. I've created a JsFiddle to show the strange behavior. In order to have a good performance, the page size must not be greater than 100 itens. http://jsfiddle.net/764tc/6/ -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Using scope data from controller in a directive
Ignore the div ng-provider forgot to remove it before changing my example. On Wednesday, March 5, 2014 8:10:28 PM UTC-7, Luke Kende wrote: It's better practice I believe to pass in data as attributes than just expecting the scope data to be there, but just use interpolation in your template as by not setting isolated scope, the template will interpolate against the current scope: div ng-provider data=providerData/div angular.module('ngProvider', []).directive('providerList', ['$location', function($location) { return { restrict: 'A', replace: true, template: 'h1{{providerData}}/h1' }; }]); On Wednesday, March 5, 2014 5:28:10 PM UTC-7, Billy Figueroa wrote: Hi All. I know directives and scopes have been covered quite a lot all over the internet but I haven't found a real example for what I want. I want to be able to access the scope from my main controller inside of a directive. Most of the posts I seen on this have to do with actually accessing attributes or values that are related to the directive it self. In this case what I want to do is grab some data that I got from the back end in my controller and then display that as part of a template in a directive... Here is sample code... App.js 'use strict'; var mintApp = angular.module('mintApp', ['ngRoute', 'ngProvider']); mintApp.config(function ($routeProvider) { $routeProvider .when('/', { templateUrl: '../../MINT/views/main.php', controller: 'MainController' }) .when('/client/signup', { templateUrl: '../MINT/views/client-membership.php', controller: 'FormController' }) .otherwise({redirectTo: '/'}); }); Controller... mintApp.controller('FormController', function($scope, $http) { $scope.providerData = {}; $http.get('../MINT/scripts/php/get_providers.php') .success(function(data) { // console.log(data); $scope.providerData = data; }); }); Directive 'use strict'; angular.module('ngProvider', []).directive('providerList', ['$location', function($location) { return { restrict: 'A', replace: true, template: 'h1$scope.providerData/h1' }; }]); Notice the $scope.providerData value I want to use in my template but how do I access this WITHOUT using a link function? and even if I do use a link function how? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Referencing $scope data inside ng-repeat
Just reference it from the the userData array: tr ng-repeat=emp in employees td{{ emp.name }}/td td{{ emp.city }}/td td{{ emp.date }}/td td{{ dateConvert(emp.date, -4) | date:'MM/dd/ HH:mm:ss' }}/td tddiv{{ userData[0].offset }}/div/td /tr On Tuesday, March 4, 2014 1:58:09 PM UTC-7, Brian White wrote: Also, the Plunker code does display the offset (-4) in the User Offset column for the employee table. But the only way I could get it to work was to add another (nested) ng-repeat, which doesn't seem like the correct way to go. I am interested in understanding how I can reference the equivalent of user.offset without using a nested ng-repeat. Thank you. On Tuesday, March 4, 2014 8:53:07 PM UTC, Brian White wrote: Hello! I'm new to AngularJS and could really use some help understanding how to reference parent? $scope data while inside ng-repeat. I'm just using the following scenario for experimentation/learning purposes. Per index.html below, I bootstrap testApp (see app.js) and inject testControllers (controllers.js) and testServices (services.js). I have a single controller called MainController into which I inject 'employeeService' and 'userService'. employeeService returns a list of employees. userService returns user profile settings for a logged in user. I use ng-repeat to display the list of employees from employeeService and want to use the offset from userService to adjust the employee hire date. But I cannot figure out how to reference the offset from userService while inside the ng-repeat for employeeService. I can use a ng-repeat for userService data and employeeService data separately to display the results for both. But I just can't figure out how to make reference to the userService data while inside the ng-repeat for employeeService data. Any help or pointers are greatly appreciated! http://plnkr.co/edit/SGelNpTbCtXb5UaA6DFk Thanks, Brian -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Angularjs to create a widget not a SPA
No, you can use it for a widget, does not have to be a SPA. Just realize that the context of the angular's javascript where you set your ng-app directive and the context of javascript everywhere else on the page are not the same thing. If they interact at all, you may want the whole page done in angular. On Tuesday, March 4, 2014 7:22:55 AM UTC-7, Fhenon De Urioste Mariaca wrote: Hello, I need to create a very complex widget and I was thinking about using angular. But I'm not sure if it is a good idea to use angular only for the widget since I don't need it for the rest of the website. Is angular only intended to be used only to create SPA? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: WebRTC with AngularJS
I really don't know enough about WebRTC but you got me checking it out. I will say that if a library is being used outside of angular, but a reference is inside angular controller, you will have to use $scope.$apply function to keep within the digest loop of Angular. That may be part of it. On Tuesday, March 4, 2014 6:06:07 AM UTC-7, Sojharo Mangi wrote: Hello, I am trying to make WebRTC enabled application. On client side, I am using AngularJS and on server side, I use NodeJS. I am having some trouble to bind video stream to video element ng-src. *Following is the Controller:* .controller('WebRTCController', function($scope){ $scope.streams = []; getUserMedia({video : true , audio : true}, successCallback, errorCallback); function successCallback(newStream){ $scope.streams.push(URL.createObjectURL(newStream)); console.log('Angular: '+ $scope.streams) } function errorCallback(err){ console.log('Some Error'); } }) *Here is the HTML page, (I use jade template)* div(ng-controller='WebRTCController') | Hello {{streams}} br video(ng-src='streams', autoplay='true') div(ng-repeat='stream in streams') video(ng-src='stream', autoplay) Kindly, let me know if this is not the correct approach. I tried first in ng-repeat and then also gave streams to ng-src directly. Inside the controller, when I print on console, I see the mediastream (it is something like this : - Angular: mediastream:4a15fb80-3aa7-4ddf-86b4-3b0cea498784) but I see it empty in my view. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
Re: [AngularJS] Navigation, Services and Controllers.
Not sure exactly what you are trying to do, but agree with Witold that services are injected into controllers and then they can handle using $location. Another option, not that it's a good one, but just to pose it for thought is that you can inject $rootScope into the service and $broadcast an event that will trigger down into any active controller. I do something like this to keep my service from making an action itself, but define a common event that could happen anywhere and manage it from one place (like the .run() section or my main controller that doesn't get lost on routes). On Monday, March 3, 2014 4:01:17 PM UTC-7, Witold Szczerba wrote: You just named it. Call services from controllers, make your services return promises (e.g. returning $http.get... or $http.get...then... or your own promises) and act upon results in controllers, using $location or what-else responsible for navigation. Regards, Witold Szczerba --- Sent from my mobile phone. On Mar 3, 2014 7:11 PM, Louis-Philippe Laurin lp.l...@gmail.comjavascript: wrote: Hi, I am new to AngularJS and wondering what is the best pattern for conditional navigation based on a service call result. When receiving a web request response at my service level. What is the best pattern to navigate to the right page in my app? The location and navigation services can be accessed from anywhere due to Angular but I would like to keep my separation of concerns and leave the navigation into the controller and my business logic in my service. Is there a right way to do it? Thanks in advance, LP -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com javascript:. To post to this group, send email to ang...@googlegroups.comjavascript: . Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Questions on best practice for external REST URLs (for email verification) and session setup via XHR
Sounds like you are on the right path. Having a SPA is good for once a user is logged in. We actually redirect the user to a login page outside of angular that handles the session and creates the cookie. The app only offers functionality once logged. Of course, you've already programmed a form for registering in angular, that's fine, but unless you want to get into automatically logging them in and handling the cookie in the app after XHR call to submit the registration, I don't see a way that you can keep the same instance running, ie, the click to confirm will have to reload the page in a new tab. And if they already are logged in as the page is loaded? Basically, the way you are headed, the app will have to make an XHR call to determine whether the user is logged in and show logged in state or show the login form. That's going to be slower than letting the server just decide as the initial page is requested. On Monday, March 3, 2014 5:30:33 AM UTC-7, Alexandros Karypidis wrote: Hi all, This is a bit of a weird question Unfortunately I am quite inexperienced in this area, so even though I've managed to get things to work, I'd feel much more comfortable if someone venerable validated my approach and path forward... So, I'm using AngularJS for a web app (nothing serious, just a hobby project), mostly to learn JavaScript and Angular... I've been working on a typical user registration system where you submit your e-mail address, wait for a verification email containing a magic URL you click on and then finish the process by completing the form (password, verify password, etc). My first questions are with regard to the pre-registration and post-registration best practices: 1. Pre-registration: should you even use dynamic JS (and hence Angular)? -- The fact of the matter is that the user will come back to the site through the e-mail link. So why use Angular and XHR to submit the e-mail of the user being registered? Is that overkill? Do people do that? I created the form in Angular, only because that's my target learning topic. The registrer button's javascript callback posts an XHR (with input obtained from Angular's data binding) call to a Play/Scala back-end (my other study topic). It then simply refreshes the view to the check your e-mail view by changing the route. When I finally got to the point where I get a registration e-mail in my inbox and have to click on the verification URL, I had a sort of duh moment where I realized I have to reload the entire web application (for good reason) when clicking on the link... There is a guaranteed discontinuity that makes the point of not refreshing the entire page sort of moot. I was thinking I could have had a regular form on the home page which is submitted to Play/Scala for processing and returns the please check your inbox e-mail. Nothing really dynamic is happening on these pages, so why bother? Is this common? 2. Post-registration: how do you login? -- In a typical web application once the user logs in, you get a session on the server and a cookie on the client. Assume (haven't implemented this yet) the user clicks on the verification e-mail and completes the registration form (name, password, re-type password for verification, submit). At this point I want the user to be logged in. I know I can create a session and set it's identifying cookie in the XHR response, but is that typical? Any special security considerations when using this approach? I can't help but notice that when I access a rich javascript site (e.g. GMail) I get a separate login page that seems to log me in with regular form posting, then refirects me to the actual web application page (with the session identity already set from the login page response). No javascript XHR, nothing fancy... So, what are your thoughts / recommended practices for this? Just looking for a bit of validation in what I'm doing, that's all... -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
Re: [AngularJS] Re: Chrome 33 Seems to Have Broken Angular
Looks like you narrowed it down to a certain bug with getComputedStyle and pseudo classes. Until that is fixed, have you come up with a work around? Your original link to the script disappeared. On Sun, Mar 2, 2014 at 4:36 AM, Robin Hoover robin.hoo...@gmail.com wrote: Thank you for taking a look! tl;dr: There is indeed a bug in Chrome 33 Stable wherein the browser soils itself if you use getComputedStyle() in conjunction with setting your pseudo-element to display:none. Bug filed with the Chromium teamhttps://code.google.com/p/chromium/issues/detail?id=236603, the discussion around which mirrors my experience exactly. Question asked on StackOverFlowhttp://stackoverflow.com/questions/22046170/explanation-on-window-getcomputedstyle-and-why-chrome-handles-it-differentlywhich also mirrors my experience. On Sunday, March 2, 2014 2:37:28 AM UTC-5, Luke Kende wrote: Can you demonstrate it in a plunker or similar? I'm not having any trouble with Chrome 33 and manipulating classes in directives. Have you debugged your directive to see where it fails? What kind of error are you seeing other than that it just doesn't work? On Saturday, March 1, 2014 4:19:45 AM UTC-7, Robin Hoover wrote: Chrome 33, all platforms. Simple set-up: AngularJS can easily change the DOM, such as writing a CSS class to an element depending on certain conditions. This should be done with what's called a directive. Big Problem: Chrome 33 is denying this simple ability to AngularJS. The simple Javascript can be found here : https://github.com/rhoover/ rhoover.github.io/blob/master/scripts/6b8958af.scripts.js This background directive was working, it no longer is!! Same mis-behavior across multiple sites, multiple computers, multiple platforms (Linux, Mac, Windows, but not Chrome for Android), multiple versions of AngularJS. Cross posted here in case it's totally a Chrome bug: https://productforums.google.com/forum/#!category-topic/ chrome/report-a-problem-and-get-troubleshooting-help/ windows7/33-Beta/UzAoyAL9xS0 -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/qdZp5wc5HiI/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
Re: [AngularJS] Re: Help finding a robust UI DnD, Cut/Paste sortable directives
So, other than implementing your own solution in Angular, what's the alternative? Does another framework/library offer the design architecture along with an extensive set of plug-n-play utilities? I don't honestly know, but I think the best you can get is one that offers the architecture yet allows jQuery plugin functionality without recoding to fit. When I researched several options to create a single page app, I did not see much that offered both. Did you explore all the options out there these days: http://todomvc.com/ To me trying out backbonejs and then going to angular was like going from C to Java as I put it.. you had to manage every little detail in backbone, and then trying angular it was like magic, no memory management required (metaphorically) it just made the connection between UI and js. Overall, I'm pretty happy with the results in Angular but I definitely had to jump through some hoops in the way I think and coming up with ways to get the job done. There's a trade off between architecture making the code more organized and being limited by that same architecture in some respects. I find it and adventure to create functionality where it hasn't already been done. That said, there's no reason why you have to keep everything in angular context. It does not prevent you from just using jQuery outside of it... you just have to make then connection with $watch and $scope.apply. On Sun, Mar 2, 2014 at 1:37 AM, Gary M ga...@oedata.com wrote: I do agree we have become used to productive toolkits like jquery.. demands for developer productivity don't change because of the tool chain. Interesting perspective..I chose angular because of the restrictive design architecture which can serve to improve quality and ease into automated testability once the methodology is understood.. The use of directives as adapters to other tool chains inherits the quality practice of the dependency, somewhat defeating the benefit of angular while incurring the additional overhead. I don't think the communities will ever make up their minds on the next javascript tooling.. Syntactic candies will entice each graduating class with a new shiny toy in each box.. Not everyone will like the same flavors. The dnd and selectable are all specific cases of the more generalized editing functions (insert,cut,paste,delete,select,deselect,undo,redo) which are not fully formalized in the current angular framework and has implications to drawing, charting and other diagramming widgets and tool chains. The browser has the capability to cut/paste from the OS. The data format is an issue.. There are monolithic solutions supporting some of those capabilities, eg. ckeditor, but they lack modularity impedance to align with the angular way.. Today, moving to angular is reminiscent of programming in C/C++ moving to a mature java tool chain, then moving back to C.. It is painful, and I hope its worth the investment. As for my little project, I'm looking at the jqueryUI directives to get a viable multilist, sortable working in a jquery layout. I'm dragging icons from sortables across different viewports to a sortable target which converts the icons to portals on drop. Very painful to attempt in angular right now.. I'll have to attempt something similar into a ckeditor target as well. Unfortunately, there are few examples in this space.. On Sun, Mar 2, 2014 at 12:30 AM, Luke Kende luke.ke...@gmail.com wrote: I think we get used to frameworks having wide coverage like jQuery or ROR, but these things take time and there's a lot of competition right now for what will be the next javascripting tool. I chose angular js because out of all the emerging libraries, frameworks, what-have-you, it seems the more promising for the future of web development. In time, I believe we will see more plugins. The community is still growing, just as this post demonstrates. I don't know any cut-and-paste utilities, so might have to implement it yourself. Most likely, it's been done before, but not sure if can be done in js alone, may require flash, or other embedded object that can make OS-level calls. If you can find an example, then it may just require implementing it in an angular way. On Saturday, March 1, 2014 10:17:51 AM UTC-7, Gary M wrote: From the overwhelming response to this post, I'll make the assumption this is not the correct forum to post this question. Its too bad application and systems design is not a priority for the angularjs community, then possibly the short comings and gaps in the framework's design may be addressed. cheers On Friday, February 28, 2014 8:25:05 PM UTC-7, Gary M wrote: Hi I'm fairly new to angularjs and have been working with it for about 2-3 months. After the learning curve on how to construct the applications, I'm attempting to build a real app. I've been having a tough time finding robust, sophisticated UI widgets which
[AngularJS] Re: Multiple $resourse URL for Factory
yes, but restful api is a little off. Meaning your save, update, and delete methods should not have to specific the action in the url since the HTTP method defines that for you. Also, the path should be consistent, not persons plural and then person singular: GET /persons--- show all person GET /persons/:id---show person by id POST /persons/:id-- save person PUT /persons/:id-- update person DELETE /persons/:id - delete person If your api was as such, then the $resource object is defined like: $resource('http://localhost:9000/persons/:id', { id: '@id'}, //assuming the object returned has property id, else '@person_id' or whatever it is called { query: { method:'GET', isArray:true }, save: { method: 'POST' }, update: { method: 'PUT' }, delete: { method: 'DELETE' } } If you cannot change the restful API, you will have to create two $resource objects in your factory and return the proper one based on the method: appServices.factory('PersonService', ['$resource', function($resource){ var Persons = $resource('http://localhost:9000/persons', {},{query: {method:'GET'}, isArray:true}; var Person = $resource('http://localhost:9000/personhttp://localhost:9000/persons /:id/:methodName', { id: '@id'}, //assuming the object returned has property id, else '@person_id' or whatever it is called //these will create the url correctly by defining the variable methodName in the parameters - just make sure id is defined when calling { get: { method:'GET', isArray: false }, save: { method: 'PUT', { params: {methodName: 'save'} } }, update: { method: 'PUT', { params: {methodName: 'update'} } }, delete: { method: 'DELETE', { params: {methodName: 'delete'} } }, } //Now you return both and your controller calls the one it needs return { all: Persons, one: return new Person() } }); }]); function MyCtrl($scope, PersonService){ $scope.personList = PersonService.all; $scope.personList.get(); $scope.currentPerson = PersonService.one; $scope.currentPerson.id = '1234'; $scope.currentPerson.$get(); } This is untested code, but should get you going in the right direction. On Sunday, March 2, 2014 8:52:39 AM UTC-7, Adil Ramdan wrote: i have a model call it Person and i have some url Rest for manage the Person GET /persons--- show all person GET /person/:id---show person by id PUT /person/save -- save person PUT /person/update -- update person DELETE /person/delete - delete person i know one factory handle multiple request method but with same url.. is my case can be handle with one factory? appServices.factory('Person', ['$resource', function($resource){ return $resource('http://localhost:9000/persons', {},{query: {method:'GET'}, isArray:true} }); }]); -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Angular.js + node.js (total.js)
Cool. Looks like a lot of work went into this. Will check it out if when I start another project with Node and Angular. On Saturday, March 1, 2014 9:53:21 AM UTC-7, Peter Širka wrote: *TOTALSTACK* Hello, total.js is web application framework for node.js and new version supports great features for development Angular.js applications. I call this: *TOTALSTACK* and here are some examples: - Example: total.js / Angular.js + Websockethttps://github.com/totaljs/examples/tree/master/angularjs-websocket (*SIMPLE CHAT*) - Example: total.js / Angular.js Routinghttps://github.com/totaljs/examples/tree/master/angularjs-routing - Example: total.js / Angular.js Resources + REST + MongoDBhttps://github.com/totaljs/examples/tree/master/angularjs-routing Framework on GitHub: https://github.com/totaljs/framework Framework homepage: http://www.totaljs.com Framework examples (more than 90 examples): https://github.com/totaljs/examples Thanks :-) -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Angular-UI bootstrap drag-drop form builder?
A little unsure what you are asking. Are you saying you want to build forms that also have options like tooltips and tabs and the like? Why not just use the two in conjunction for your project. If you want to make a tool that uses both, they are open source, so fork them and dig in you will really learn Angular at deep level. On Saturday, March 1, 2014 8:06:35 AM UTC-7, Alec Taylor wrote: Dear Angular community, Is there anything like this for Angular-UI?: http://kelp404.github.io/angular-form-builder Would like to support a subset of: http://angular-ui.github.io/bootstrap If there is nothing freely available; how would one go about engineering one? Thanks for all suggestions, Alec Taylor -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Help finding a robust UI DnD, Cut/Paste sortable directives
I think we get used to frameworks having wide coverage like jQuery or ROR, but these things take time and there's a lot of competition right now for what will be the next javascripting tool. I chose angular js because out of all the emerging libraries, frameworks, what-have-you, it seems the more promising for the future of web development. In time, I believe we will see more plugins. The community is still growing, just as this post demonstrates. I don't know any cut-and-paste utilities, so might have to implement it yourself. Most likely, it's been done before, but not sure if can be done in js alone, may require flash, or other embedded object that can make OS-level calls. If you can find an example, then it may just require implementing it in an angular way. On Saturday, March 1, 2014 10:17:51 AM UTC-7, Gary M wrote: From the overwhelming response to this post, I'll make the assumption this is not the correct forum to post this question. Its too bad application and systems design is not a priority for the angularjs community, then possibly the short comings and gaps in the framework's design may be addressed. cheers On Friday, February 28, 2014 8:25:05 PM UTC-7, Gary M wrote: Hi I'm fairly new to angularjs and have been working with it for about 2-3 months. After the learning curve on how to construct the applications, I'm attempting to build a real app. I've been having a tough time finding robust, sophisticated UI widgets which interoperate. I have found a number of directives for simple widgets eg, angular-ui and some other outliers with limited capabilities as sortable, ui.sortable and muti-sortable. I haven't found anything for cut and paste. I'm assuming there are widgets modules out there, I guess I'm just not finding them.. I have checked http://ngmodules.org/ and github but struck out there. Any clues on where else to look ? or is what I'm looking for just doesn't exist ? cheers, gary -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Chrome 33 Seems to Have Broken Angular
Can you demonstrate it in a plunker or similar? I'm not having any trouble with Chrome 33 and manipulating classes in directives. Have you debugged your directive to see where it fails? What kind of error are you seeing other than that it just doesn't work? On Saturday, March 1, 2014 4:19:45 AM UTC-7, Robin Hoover wrote: Chrome 33, all platforms. Simple set-up: AngularJS can easily change the DOM, such as writing a CSS class to an element depending on certain conditions. This should be done with what's called a directive. Big Problem: Chrome 33 is denying this simple ability to AngularJS. The simple Javascript can be found here : https://github.com/rhoover/rhoover.github.io/blob/master/scripts/6b8958af.scripts.js This background directive was working, it no longer is!! Same mis-behavior across multiple sites, multiple computers, multiple platforms (Linux, Mac, Windows, but not Chrome for Android), multiple versions of AngularJS. Cross posted here in case it's totally a Chrome bug: https://productforums.google.com/forum/#!category-topic/chrome/report-a-problem-and-get-troubleshooting-help/windows7/33-Beta/UzAoyAL9xS0 -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: how to pass a object to a new page in angulatjs
You'll need to keep your objects referenced in a service, then use some id that maps to the $routeParam. Something like this: function MyService(){ var objects = [ { id: 1, data: 'the data'}, { id: 2, data: 'more data'} ] return objects; } //in new route controller - this not fully fleshed-out code just providing the idea var indexOfObject = MyService.indexOf($routeParams.id); $scope.object = MyService[indexOfObject]; So in essence you are passing references not objects, and storing shared data in a service. On Thursday, February 27, 2014 9:18:12 AM UTC-7, duck wrote: I have a list of objects in the list view, now I want to click any one object to take me a new page without fetching data from server, so the object data can be passed to the new page. I can use angularjs $routeParams to pass individual parameter, but not whole object. if I use a individual parameters to fetch data from server, it slows down the performance. Thank you for your help! Lily -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Adding special symbols in bound data
Use ng-bind-html http://docs.angularjs.org/api/ng/directive/ngBindHtml On Thursday, February 27, 2014 7:35:33 AM UTC-7, Yonatan Kra wrote: Hi, I have a simple bound data such that: div ng-repeat=item in items ng-bind=item/div *items *exist in the scope and hold several text and/or HTML snippets (very simple snippets). Some of my items contain special symbols like: #176 (which is the degree symbol). When they are printed out, I see the symbol code and not the symbol itself. How do I add these symbols to my UI? -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Group common services or individual specialized services?
The general practice is to put it in a service, which exists in a file named services.js. I have my api for many assets all in one service and the file contains many services in addition to the API $resource. If you want it to be somewhat modular to share between different angular apps, then put it in it's own module and call the file whatever you want. A simple name like AssetService is fine. angular.module('AssetApi', []). service('api', ['$http','$resource', function($http, $resource){ var Assets = $resource('/api/assets',{},{ get: { method: 'get' } }) }); On Friday, February 28, 2014 12:14:50 AM UTC-7, Miguel Aramis Ramírez wrote: Let's say I have an API that knows how to update/delete/create an Asset... What is the best practice? To have a single file AssetServices? Or have UpdateAssetService/DeleteAssetService/CreateAssetService? Thanks! -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
Re: [AngularJS] Re: Is there any directive to affect immediately between controller and view except ng-model?
I don't completely understand what you are trying to do, but I'm guessing that I might set the tooltip triggers to just use { focus : blur } so that the tooltip is always open when a user is typing, then change the tooltip text according to events: input type=text ng-model=inputField.text tooltip={{inputField.tooltip}} ng-enter=inputField //in controller $scope.inputField = { text: null, tooltip = Please enter a 12 digit number } //on press enter in directive attrs.inputField.tooltip = Verifying number... //on return from server call when error: $scope.inputField.tooltip = Invalid number Does this give you the idea? Otherwise, you can only use basic input events, not customer functions or custom events to pass to setTriggers()... it won't work. You can look at the source code here: https://github.com/angular-ui/bootstrap/blob/gh-pages/ui-bootstrap-0.9.0.js On Thu, Feb 27, 2014 at 6:12 AM, Sowmiya sundarasugany...@gmail.com wrote: Hi, I'm trying to show the message in popover/tooltip when text box satisfied the below conditions 1.Only allows number and 12 digits too. Here, I have created the custom ng-enter directive to allow key code = 13. I'm using ng-pattern=/^\d{12}$/ for above mentioned conditions. Now I have call one method for getting data in server when the above conditions are satisfied. If that number is not present in server, popover will come with some message like this requested no is not found I have call this popover in method failure callback. *Here is the problem* *when I sent the request,that req will fails and it goes to failure callback, but popover does not initialized.SO It wont come.* *If I enter 2nd time,it comes.* *I have trigger th popover like below,* *.config(['$tooltipProvider', function($tooltipProvider) { $tooltipProvider.setTriggers({ 'keypress': 'mouseleave', 'never': 'keydown' });}])* *I think its the time delay of calling popover trigger?* *Can u solve it?* On Thursday, 27 February 2014 12:13:39 UTC+5:30, Luke Kende wrote: what do you mean? pretty much all directives are immediate. ng-bind ng-include ng-show/hide ng-switch and so on On Wednesday, February 26, 2014 8:19:04 AM UTC-7, Sowmiya wrote: *Hi,* * Is there any directive to affect immediately between controller and view except ng-model?* -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/DW20vf3nrgM/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: ng-view, partials, routes and stuff
If you need nested views where parent view needs to maintain state after going from /admin to /admin/user/cf23df2207d99a7, and you are going to have a lot of these, or multiple nestings, then I suggest ui-router: https://github.com/angular-ui/ui-router Personally, it was more than I needed so instead of ng-view I use ng-include and $watch for $routeChangeSuccess : $routeProvider .when('/admin', { templateUrl: '/partials/admin.html' }) .when('/admin/user/:user_hash', { templateUrl: '/partials/admin.html' //notice it's same template because will be handled }) body ng-controller=MainCtrl header/header div ng-include=currentTemplate/div footer/footer /body function MainCtrl($scope, $route){ //scope for main controller that lives for the lifetime of the page - don't bloat it with stuff for all views $scope.headerStuff = ... $scope.footerStuff = $scope. currentTemplate = '/partials/empty.html'; //temporary for first load $scope.$on('$routeChangeSuccess',function(){ /* here you catch the change without having ng-view force you in to loading it's template and controller I can make my own logic on whether to load a new template, or not and let the controller in admin template also catch the routechangesuccess and it can use ng-include or ng-switch as it needs - now we have a way to map routes and manage them more under our control */ if ( $scope. currentTemplate != $route.current.templateUrl){ $scope. currentTemplate = $route.current.templateUrl; } }) } //admin partial div ng-controller=AdmingCtrl div id =adminStuff/div div ng-include='innerTemplate'/div /div function AdminCtrl($scope, $routeParams){ $scope.adminStuff = ... $scope. innerTemplate = 'parials/empty.html'; //for when nothing needs to be here $scope.$on('$routeChangeSuccess',function(){ $scope.user_hash = $routeParams.user_hash; $scope. innerTemplate = 'admin.user.html' //now we load the user template }) } Anyway, this might be too bit to digest as a newbie, but maybe it will plant the seed to think outside the box. On Wednesday, February 26, 2014 7:40:31 PM UTC-7, Andy Czerwonka wrote: Angular newb here. I just want to make sure I've got this right. 1. When I want addressable URL's I should use ng-view and load partials using the $routeProvider to bind local controllers to specific URL's. 2. State inside a particular controller should be managed using scope variables, i.e. don't try and build nested views. I'm trying to follow https://github.com/IgorMinar/foodme as a working example, but it's a fairly trivial example that doesn't go anywhere near a complex structure. For example, if I have an /admin endpoint and within that I wanted to do user admin and maybe some configuration of some kind, I would expect something like /admin/user and /admin/configuration as addressable endpoints. If I want something like that, is there a best practice? I was using ng-switch to get the right page once in the /adminpartial, but everything lives under /admin. If I want to take it further and get to /admin/user/cf23df2207d99a7, then I'm in trouble. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
Re: [AngularJS] How future proof is Angular JS in terms of Google Chrome Updates
Angular does support IE8: http://docs.angularjs.org/guide/ie We have it tested and working for IE8+. There were a couple of tweaks and polyfills that had to be done in the initial testing phase for our own implementation. It's your choice, but it's not a lost cause. We've been running Angular in production for about 6 months and Chrome is the core browser we develop for. I suppose there's been at least two Chrome updates and absolutely no issues to report. If you have a test suite you can run that on the beta releases before the browser is pushed to your clients. On Wednesday, February 26, 2014 8:49:08 AM UTC-7, Kevin Shay wrote: This is definitely a concern, but I think it's orthogonal to the use of Angular. Chrome does auto-update unless that's deliberately disabled, and those updates can change core JavaScript behavior (usually in the name of security) which can break functionality. Two recent examples we ran into, not in the context of an Angular app, which caused unexpected disruption for users and required significant investigation and effort to work around: * A button on a form was making an XHR call to do something on the backend, then displaying the result in a new tab on success. The latest Chrome suddenly decided this looked like an unwanted popup (even though the user had clicked to initiate the action) and tried to block it; if you told it to allow the popup, it would only open it thereafter in a new window, not a tab. * A locking module (Drupal) we were using to prevent multiple users from editing the same item was relying on an XHR request to release the lock when the page was unloaded. Obviously not a fully reliable mechanism, but worked well enough--until Chrome decided to disallow requests triggered by this event when you navigate away from a page (although not when closing the window/tab, for whatever reason). I've never seen any announcement or discussion of changes like this, and spent some time poring over changelogs without finding any acknowledgement of them. It's really not an ideal situation, and you might want to discuss with your IT department the possibility of disabling automatic Chrome updates. But again, this is not an Angular-specific issue. Kevin On Wed, Feb 26, 2014 at 6:18 AM, Raymond raymon...@gmail.comjavascript: wrote: Hi All, We've started using Angular JS in developing a core in-house application. We've decided to support running the web application in Google Chrome only. We've been completely satisfied with using Angular JS as our client-side scripting framework. But we'd like to know how future proof and reliable it will be in terms of Google Chrome updates. My concern is the possibility of a future Google Chrome update breaking Angular JS/UI code thus affecting our web application. I know the same thing could be said with using another JavaScript library and/or another browser and/or operating system. I was also under the impression that our company's Google Chrome updates were controlled by an administrator. But just recently, I've seen our Google Chrome version was updated to the latest. I'd be glad to hear your inputs. Thanks! -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com javascript:. To post to this group, send email to ang...@googlegroups.comjavascript: . Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Is there any directive to affect immediately between controller and view except ng-model?
what do you mean? pretty much all directives are immediate. ng-bind ng-include ng-show/hide ng-switch and so on On Wednesday, February 26, 2014 8:19:04 AM UTC-7, Sowmiya wrote: *Hi,* * Is there any directive to affect immediately between controller and view except ng-model?* -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
Re: [AngularJS] Re: Using same object for two different dom elements after fetching from the database.
Nope. Each of us programs a little differently. Personally, I'd probably transform the data before sending to storage so that each todo is a single object that references the lists it belongs to. That way upon retrieving them you just rebuild your lists' arrays pointing to a single object that shared again. On Tue, Feb 25, 2014 at 1:42 AM, Martin Doktár martin.dok...@gmail.comwrote: Hi! Thanks for your answers! I was guessing this was happening. Any tips on how I could manage this when retrieving the object? There are no best practises for this? Regards, Martin -- You received this message because you are subscribed to a topic in the Google Groups AngularJS group. To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/1vNeCii3cdk/unsubscribe. To unsubscribe from this group and all its topics, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Using same object for two different dom elements after fetching from the database.
Reiterating what Sander is saying, you are referencing one object initially in both arrays, but after parsing, you have two separate objects. You'll need to manage this either upon saving or retrieving (or both) to get the intended results. On Monday, February 24, 2014 1:52:22 PM UTC-7, Martin Doktár wrote: Hi. I'm trying out angular for the first time and want to accomplish the following: 1. Multiple todo lists 2. Each todo can belong to one or more lists 3. Updating a todo belonging to more than one lists, updates the todo in all lists. 4. Store and load the lists/todos I'm trying out different solutions on how to handle multiple lists/todos, but are running into some problems with storing and fetching the todos without loosing each todos singularity. For example: 1. http://plnkr.co/edit/etSJMWXhwwRoY4jCozP9?p=preview 2. Click Add task to all lists one or more times 3. Edit newly created task/todo and notice both lists updating 4. Click Save 5. Reload page and try to edit same tasks. Only one list is updated. I think I understand why this happens, I just don't know enough about angularjs to fix it. I wan't the same behaviour before and after clicking save and reloading. Any help is much appreciated! Regards, Martin -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: How to handle a decimal value in AngularJs
You'll need to create a plnkr or similar to demonstrate this issue. Angular doesn't just convert a float to an object like this. It looks like the value is being split() with no delimiter to get an array and then converted to an object. That's the only way to get there that I can tell. On Monday, February 24, 2014 11:15:57 PM UTC-7, Deeksha Sharma wrote: Hi everyone, I am returning a decimal value like 43.0 and getting it in angularjs object like {0:4,1:3,2:.,3:0}. So, why it is getting converted in json key value pair format. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: Model and view update through angularJS
If you just need to see that the value is updating on the $scope, use an ng-click on a button to call a function and console.log() the value after you've changed it in the view. div ng-controller=myCtrl input ng-model=item.text button ng-click=logTextLog it/button /div function myCtrl(){ $scope.item = { text: '' } $scope.logText = function(){ console.log($scope.item.text) } } On Monday, February 24, 2014 2:43:46 PM UTC-7, Ron Likvornik wrote: Someone told me that in Angular when i update something in the model the view should be updated automatically. And when i update something in the view the model should be updated automatically. I can see why the view updated automatically when i change the model but i cannot see the opposite. Can you give me an example for that?Thanks. -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
[AngularJS] Re: listening to css3 transition events in angularjs
You can create a directive to do this and add it to the body tag if you want just one catch for any 'transitionend event. Event handling in Angular and say jQuery are very different systems, so the $on events are only for built-in angular events or where you $broadcast or $emit an event purposely. body catch-transitions !-- your html -- /body angular.module('myApp', []).directive('catchTransitions', function(){ link: function(scope,element){ //if you included jquery, now you can do typical stuff with it $(element).bind('transitionend', function(e){ //be aware of other event names from other browsers vendor-prefixed console.log(''got a css transition event, e) }) }) On Monday, February 24, 2014 6:18:36 PM UTC-7, Jake K. wrote: Hello How can I listen to CSS3 transition events in angularjs? So far I've tried with $rootScope.$on but it's not working. Thanks -- You received this message because you are subscribed to the Google Groups AngularJS group. To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscr...@googlegroups.com. To post to this group, send email to angular@googlegroups.com. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.