How to Programming with Angularjs

javascript,angularjs,performance,caching,angularjs-ng-repeat

You can enable AngularJS CSP support. More details here. Sample code below: <!doctype html> <html ng-app ng-csp> ... ... </html> ng-csp forces you not use code that can be injected like eval and Function. ng-sanitize from doc. The input is sanitized by parsing the HTML into tokens. All safe tokens...

Angular ng-repeat cache (avoid re-rendering on state change)

Well if you disable the scope of the scope that the ng-repeat is on. Then it will no longer render. It essentially becomes static content. This allows you to actually control when it is rendered. ux-datagrid actually uses this concept to turn off dom that is out of view so...

Pre-Select of an option in a select not working

javascript,angularjs,node.js

Bind value in model to get selected. Try like this $scope.rule.condition=$scope.conditions[0].value; ...

AngularJS: Adding ng-click within element.append

angularjs,directive

You should compile the html to bind the directives like ng-click to scope properties. Other vice angular directives will not bind to the scope properties. var strElm = '<button class="btn btn-info" ng-click="selectProperties()" title="Assign this user"><span class="glyphicon glyphicon-user"></span>Assignment</button>'; var compiledHtml = $compile(strElm); element.append(compiledHtml); and don't remove $compile service from directive, and...

REST API with token based authentication

angularjs,codeigniter,api,rest,token

You can use an API key, however - as you wrote - it's pure protection and easily accessible value - potential abuser just needs to view the source or investigate the queries. In general REST APIs are secured with tokens. At the beginning of the session (not in traditional meaning...

Iframe does not show scrollbar

html,css,angularjs,iframe,ionic

You have hidden scrollbars in ionic.app.css: ::-webkit-scrollbar { display: none; } I don't know if it is possible to override this style so probably you have to remove it. Similar question....

Getting CROS Error even after adding header in node.js for Angular js

The error message spells it out for you. Your client side code is trying to set an Access-Control-Allow-Origin header: RestangularProvider.setDefaultHeaders({"Access-Control-Allow- Origin":"*"}); Your server side code allows a number of headers, but that isn't one of them: 'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept"', Remove the line: RestangularProvider.setDefaultHeaders({"Access-Control-Allow- Origin":"*"}); Access-Control-Allow-Origin is a response...

UI-Router : Prevent access to parent state

angularjs,angular-ui-router,state

There is a working example Make your state abstract: .state('app', { url: '/app', abstract: true, // here template: ' <div ui-view></div>', authenticate: true }) And add some default redirections: $urlRouterProvider.when('/app', '/app/state1'); $urlRouterProvider.otherwise('/app/state1'); The first 2 links below will redirect to 'app.state1' <a href="#/app"> // will be redirected to state1 <a...

success and error function in the controller for a service

javascript,angularjs,angularjs-service,angularjs-http,angularjs-promise

..I want to write the success and error function of $http.get in the controller.. Usually, the .then() function takes two function arguments with first one as the success handler and seconf one as error handler. $http.get(url,options).then(function (response){ //success handler function },function(error){ //error handler function }) Alternatively, you can specify...

How do I add a class on ng-click from layout?

angularjs,angularjs-scope

In your plnkr the css for active-link was missing, and I wrapped the assigning of the clicked link in a function. Check this updated plnkr. The function is pretty basic: $scope.changeActiveLink = function(link) { $scope.activeLink = link; } Now the links are green when clicked. This is what you wanted...

Getting generic anchor text on click with angularJS/jQuery returns empty string

jquery,angularjs

You are mixing jquery with angular logic with var title = $(this).text(); . You shouldn't try to do this. the $("this") is not referencing what you think it is in that context. You could try logging it to see what I mean. Instead, just pass back the object ng-click="findArticleByTitle(article)" then...

AngularJS - $scope undefined within same controller

This is an order of operations issue. When you console.log($scope.weather[0].latitude) in the if statement $scope.weather has not actually been set yet because the City.get() call is asynchronous. This means $scope.weather will not be set until a successful response is returned from the City service, which in your case will execute...

AngularJS, Animate on change: directive $watch not called

You need to change the first argument on the $watch, to be a function returning your variable, instead of the variable itself: scope.$watch(function () { return scope.animateWatch; }, function (nv, ov) { call(); }, true); Take a look here at the docs at the watch section....

remove char from string with angular

angularjs,model-view-controller,ionic-framework,ionic

Just use replace: If v_value is a string: value: {{item.v_value.replace('.', '')}} If v_value is a number, "cast" it to a string first: value: {{(item.v_value + '').replace('.', '')}} Basically, you can use JavaScript in those brackets....

How to select multiple selected value from select option

Here is the jsfiddle I used ng-repeat to build the select and ng-options to fill them, you then have to use the relative ng-model to get the selections. HTML: <div ng-app ng-controller="MyCtrl"> <select class="select fancy" ng-repeat="(i, item) in items" ng-model="searchOption[i]" ng-options="type.name for type in item.types"></select> <button ng-click="submitIt()">Submit</button> </div> Javascript: function...

Programmatically enable GPS of device when application opens in cordova

angularjs,cordova,ionic,cordova-plugins

You could check the error code in PositionError parameter of geolocationError in your call to getCurrentPosition. I am guessing that it will be PositionError.PERMISSION_DENIED when gps is not enabled, and PositionError.POSITION_UNAVAILABLE or PositionError.TIMEOUT when gps is enabled but there are other issues. Note that this is platform dependent. You would...

Angular submit not called when required fields not filled

javascript,angularjs,forms

You need to add novalidate to your form. The reason being, your browser is validating your form rather than letting your code do it. alternatively, do something like: <form ng-submit="submit()" name="form" novalidate> <ion-radio ng-repeat="item in items" ng-model="data.type" name="type" ng-value="item.value" ng-class="{'error' : form.type.$invalid && form.$submitted }" </form> form.$submitted will become true...

Change input field in angularJS

Use preventDefault when 'b' was pressed. self.keyPressFunc = function(eventa) { self.eventa = eventa; if (eventa.charCode == 98) { // if 'b' self.testValue = "y"; eventa.preventDefault(); } }; ...

How to disable the form submit when input fields are incorrect in angularjs

You appear to want all fields to be required, but that when users think they're ready for form submission, they are kindly notified if they have forgotten any required fields. Normally this is achieved with ng-submit and something like: <span ng-if="myForm.$submitted && myForm.formField.$error.required">Please enter information for 'formField'</span> Here the users...

How do I update a view after ng-submit calls a factory function?

javascript,angularjs,angularjs-scope

The code is working, but the repsonse does not have the assumed properties when the city is not provided or wrong city is provided. So maybe use ng-required, as the code will fail if the postData.city is not set http://plnkr.co/edit/7F3EUMyAXtAlBR9CGWb0?p=preview .success(function(data) { console.log(data); $scope.test = 'This is the NEW value';...

$scope variable does not update within $interval function

The problem is probably not using a dot in ng-model. There probably is an inherited scope being created by a parent node which contains the HTML posted in the question. See also: AngularJS: dot in ng-model AngularJS: If you are not using a .(dot) in your models you are doing...

angular.js - simplest way to handle click inside controller

javascript,jquery,html,angularjs

You don't really want to handle any DOM stuff in controllers (a controller just ties data to the view, which happens to be the DOM). You want to use a directive for DOM manipulation. (However, yes, ng-click is a built-in directive that can run methods inside the controller). If you'd...

Create angular page in Django to consume data from JSON

angularjs,django,django-templates

You can add the angular app as a simple template view in Django views.py def index(request): return render(request, 'yourhtml.html', {}) urls.py .... url(r'^your_url/$', views.index), .... Then the index.html file can have your angular code...

angular filter in order by letter

javascript,angularjs,angular-filters

You are re-inventing the wheel. Checkout angular build-in filter for ng-repeat https://docs.angularjs.org/api/ng/directive/ngRepeat <li ng-repeat="page in pages | filter:x"> Reading your code more thoroughly I think you have some misunderstanding of angular logic there as well. For example, you don't need extra function to detect search change and then getting the...

Passing params to an angular service from a controller?

javascript,angularjs,service,controller,params

You can declare your service as: app.factory('books', ['$http', function($http) { // var url = 'http://...' + ParamFromController + '.json' return { getVal: function(url,options){ return $http.get(url,options) } } }]); and use it in your controller and provide appropriate params to pass into 'books' service: app.controller('BookController', ['$scope', '$routeParams', 'books', function($scope, $routeParams, books)...

Can't save json data to variable (or cache) with angularjs $http.get

json,angularjs,web-services,rest

$http.get is asynchronous. When cache.get or return result are executed, HTTP request has not completed yet. How are you going to use that data? Display in UI? E.g. try the following: // Some View <div>{{myData}}</div> // Controller app.controller('MyController', function ($scope) { $http.get('yoururl').success(function (data) { $scope.myData = data; }); }); You...

jquery append() is creating two div elements

javascript,jquery,json,angularjs,jquery-ui

Since you have used angularjs, use a angularjs solution <div class="content-wrapper" ng-controller="mission_visionCtrl"> <div class="container-fluid"> <div id="header-wrapper" class="container"> <div id="header" class="container"> <div id="logo"> <h1 class="page-head-line" id="visionh"><a>Vision</a></h1> <p id="visionp"><a rel="nofollow">{{visiontext}}</a></p> </div> </div> </div> <div class="row" id="missionstart"> <div...

function is undefined if no module is declared in Angular

javascript,angularjs,indexof

1st one you used is nothing but global function declaration of controller, in which you declare controller as function. To analyse the Angular the function should be treated as controller we need to use post-fix as Controller. The reason it is not working because you are using Angular 1.3 +...

Using indexOf() to search array inside ng-repeat

The problem here is the data type of the values, the read_by array has int values where as member.id is string. One easy fix is var app = angular.module('my-app', [], function() {}) app.controller('AppController', function($scope) { $scope.isRead = function(member) { return $scope.message.read_by.indexOf(+member.id) > -1; } $scope.message = { read_by: [1, 2,...

Can't get angular.js to loop through array and post to html

angularjs,ng-repeat

It looks like you have some syntax errors: var app = angular.module('myStore', []); app.controller('StoreController', function(){ this.products = [ { name: 'keyboard', price: 20.47, description: "well made from scratch", reviews: [ { stars: 5, body: "great fantadtic worksmanship", author: "[email protected]" }, { stars: 4, body: "amazing sale for the best", author:...

Is there a way to fire an event every time an ajax call in made in AngularJS?

javascript,ajax,angularjs,express

In Angular this can be solved with an interceptor. See Angular-loading-bar as example.

Animate removal of list items with css

css,angularjs,css3,animation,css-animations

The idea is to set the height of container and add transition to the height. $scope.styles.height = $scope.messages.length * 20 + 'px'; http://plnkr.co/edit/3dnGeVoQ1DbX55WQtJjk?p=preview...

Change placeholder value depending on locale - angularJS

angularjs,localization

If you just want to switch between german and the rest of the world, you can have something specific in your controller: <input placeholder="{{getLocalePlaceholder()}}"> Controller: $scope.getLocalPlaceholder = function() { if ($local.id === 'de-de') { return 'TT/MM/JJJJ'; } return 'mm/dd/yyyy'; } If you want to be more generic, I suggest you...

ng-repeat not working in md-chip

angularjs,angular-material

with angular 1.3.15 / angular-material 0.9.8, the following works here: in the controller: $scope.myNumbers = [ 1, 2, 3 ]; in the HTML: <md-chips ng-model="myNumbers" readonly="true"> </md-chips> ...

AngularJS use a directive inside a ng-repeat

angularjs,angular-directive

I would do something like this: Markup: <div ng-app="myApp"> <ul id="todo-list" ng-controller="Ctrl"> <li ng-repeat="x in todo"> <ng-form name="repeatForm" highlight=""> <button ng-click="open()">{{x.doc._id}}</button> <label class="label label-info">{{x.doc.Name}}</label> <span>{{x.doc.Address1}}</span> <span>{{x.doc.Address2}}</span> <span name="expDt" past-date="">Expiry Date: {{x.doc.IssueDtto}}</span> <span class="help-block"...

Save to 3 firebase locations with a slow internet connection

javascript,angularjs,firebase,latency

There is no Firebase method to write to multiple paths at once. Some future tools planned by the team (e.g. Triggers) may resolve this in the future. This topic has been explored before and the firebase-multi-write README contains a lot of discussion on the topic. The repo also has a...

Angularjs resource with scope parameter

javascript,asp.net-mvc,angularjs,single-page-application

If this is an AJAX call then the varialble initialization should be into the callback methods: Fakturi.fakturi.get({ id: $routeParams.id }, function (data) { $scope.faktura = data; }); Fakturi.komintenti.get({ id: $scope.faktura.KomintentID }, function (data) { $scope.komintent = data; }); According to this link, if you would like to get response immediately...

Updating View in Angular js on ajax success callback

ajax,angularjs

Your code correctly performs a GET request to inactivate the offer, however you do not "tell" Angular that the offer has been inactivated. What you need to do is remove the offer from the offers list $scope.offers once the offer is successfully inactivated (ie. when the inActivateOffer promise is resolved)....

Display unlisted value in select with ng-options

javascript,angularjs,restangular

Interesting problem. I think that you will be able to achieve this with the combination of ngInit directive to set up initial value (it can be missing from the allowed options list) and ngShow to hide it once valid option is selected. Something like this: <select ng-init="preselected = selected" ng-change="preselected...

Error: [$injector:unpr] Unknown provider: RestangularProvider <- Restangular <- ctrlAG

You didn't inject module of 'Restangular' service. Try like this angular.module('AngApp', ['angularGrid','restangular']); ...

Check if expression in directive is defined?

You can do it in the link function of the directive as below: return{ restrict: 'E', scope: { func: "&?" }, controller: 'directiveCtrl', controllerAs: 'vm', bindToController: true, link:function(scope,element,attrs){ if(attrs.func) { attrs.$observe('func', function(value) { console.log(value); }); } } ...

Cannot read property 'then' of undefined - AngularJS

angularjs,restangular

Your service method does not return the promise of what Resangular.all().post() is supposed to return. Its a q promise. register: function (registerData) { this.logout(); return Restangular.all('api/account/register').post(registerData); //return $http.post("api/account/register", {data:registerData}) } ...

Add multiple rows from same model AngularJS

angularjs,node.js

You should have an array of users in your controller and every time you press "Add another user" you can add a new user to your array. The code in your controller: $scope.users = [{ name: "1" , email: "email1", password:"pas1" }, { name: "2" , email: "email2", password:"pas2"}];; $scope.addUser...

How to access HTML variable in Java-script in angularJS

javascript,html,angularjs,mongodb

Change your html to this: <select class="form-control" ng-model="NewProduct.category" ng-options="category as category.name for category in Categories | orderBy:['name']" ng-change="update(NewProduct.category)" required></select> This will store the entire category in NewProduct.category instead of just the id...

AngularJS factory dependencies

DOCS Change your factory to service as you are using this factory return an object or primitive type not bind with this app.services('articleFactory', ['$q', '$http', function ($q, $http){ this.getAllArticles = function (){ var deferred = $q.defer(), httpPromise = $http.get ('/entries'); httpPromise.success (function (data){ deferred.resolve (data); }) .error (function (err){ console.log...

How push object onto array of array in Angularjs

javascript,arrays,angularjs

Actually instead of adding properties dynamically you should rethink the structure of the allBooks object you're trying to create. The way I understand it, is that you have a collection of books belonging together, which in their turn belong to another collection. In other words you have an array of...

String comparison in AngularJS

javascript,json,angularjs,ionic-framework,string-comparison

You are iterating over wrong node:) for(var i=0;i<$rootScope.items.length;i++) { alert("Inside for loop"); if (name === $rootScope.items[i].names) // you iterate over items, not names, which it an Json property inside item { alert("If condition satisfied"); } } ...

How can this be undefined in the constructor of an Angular config class?

angularjs,constructor,typescript,undefined,this

Config functions aren't classes and shouldn't be written as such. Angular is invoking them without new and thus this will be undefined (or, God help you, window in non-strict mode). It doesn't really make sense to use a class here as there's no instance to be kept around. If you...

How to define style to layout-margin flex variants, using Angular Material

css,angularjs,angular-material

Angular material doesn't add or remove the attributes based on the browser size, so both [flex] and [flex-sm] will always be on your element. That is why they both apply, you will have to write a media query with the same break point as angular material if you want to...

Can rspec be used to feature test an integrated rails-angular app?

ruby-on-rails,angularjs,rspec,capybara

My guess is that your create(:fighter) call is running in a different thread (and database transaction) than the AJAX get request. Try adding this snippet to your rails_helper. class ActiveRecord::Base mattr_accessor :shared_connection @@shared_connection = nil def self.connection @@shared_connection || retrieve_connection end end ActiveRecord::Base.shared_connection = ActiveRecord::Base.connection Source: https://github.com/jnicklas/capybara#transactions-and-database-setup...

Angularjs $watchCollection on $rootScope not triggered when values updated from directive

javascript,angularjs,events,angularjs-directive,angularjs-watch

Your actual problem is you are update $rootScope from the event which is outside the angular context, so its obivious that angular binding will not update because digest cycle doesn't get fired in that case. You need to fire it manually by using $apply() method of $rootScope el.bind('click', function(evt) {...

Passing argument to a factory for a service

A factory creates an object and returns it as the publically available operations. So, you can create and return an object that wraps the HTTP call: app.factory('getUser', ['$http', function($http) { function myInternal(arg1) { return $http.get('https://myUrl?param=' + arg1) .success(function(data) { return data; }) .error(function(err) { return err; }); } return {...

Angular directive not applied on change of the value

angularjs,angularjs-directive

In your code, the link function is executed only once so the value is updated only when the directive instance is created. Since you want to have a watch of its value and keep updating the text you can use $observe() var app = angular.module('my-app', [], function() {}) app.controller('AppController', function($scope)...

Pass scope to element.after()

You could try creating an angular element and compiling it against the scope you want it to have with $compile e.g. var newElement = angular.element('<div data-autocomplete-results></div>'); element.after($compile(newElement)(scope)); Also you would need to do this in the link function, as scope is unavailable during the compile phase of the digest cycle....

validation of AngularJS direcrives

angularjs,html5,html-validation

data- prefix can be used by any directive and the underlying directive name normalization process takes care of matching the directive attribute declaration with the directive implementation. More details about the normalization process is available in the directive user guide under section "Matching Directives". Hence adding data- prefix to to...

AngularFire pushing to array doesn't work

javascript,arrays,angularjs,firebase,angularfire

You only need to call $save on $firebaseObject instances. In fact the call to $save might well break things, since it triggers a potential race condition between the push and the $save. Update This will work: groupControllers.controller('MemberGroupController', ['$scope', '$firebaseArray', '$routeParams', '$location', '$routeParams', function($scope, $firebaseArray, $routeParams, $location, $routeParams) { $scope.groups =...

Angular Js Drag and Drop - Passing $index to Directive

javascript,angularjs,drag-and-drop

There are quite a few problems with your code. I'd suggest studying the official documentation and some SO questions related to custom directives and isolate scopes. Here is some updated code with many changes and an updated fiddle: <body ng-app="my-app"> <div ng-controller="MainController"> <h3>Match the following</h3> <div class="container"> <header> <h1>Drag and...

Using ng-click to toggle between two functions

javascript,angularjs,angular-ui,angular-ui-bootstrap

You can create a toggle() function which will call the function you want based on a variable tracking the state. You can then simply use this function in your template as ng-click="toggle()". Something like this. var toggled = false; $scope.toggle = function() { if (toggled) { $scope.clear(); } else {...

text formatting with AngularJS

Angular doesn't allow you to display html right away, you have to say that it's trusted so change your success to this (make sure you have dependency injected $sce): $scope.fullArticle = response; for(var x = 0; x < $scope.fullArtcile.length; x++){ $scope.fullArticle[x].trustedBody = $sce.trustAsHtml($scope.fullArticle[x].body) } And then make your html this:...

How to add class on ng-click?

If your using classes like active-link, x-y which have dash (-) then you have to wrap it in ' as below. ng-class="{'active-link' : activeLink==='PersonalInfo'}" if your classes like activeLink which are doesn't have dash (-) then you can avoid from ' but not a must. ng-class="{activeLink : activeLink==='PersonalInfo'}" here is...

how to get ng-repeat checkbox values on submit function in angularjs

<div ng-repeat="item in items"> <input type="checkbox" ng-model="item.SELECTED" ng-true-value="Y" ng-false-value="N"/> </div> <input type="submit" name="submit" value="submit" ng-click="check(items)"/> $scope.check= function(data) { var arr = []; for(var i in data){ if(data[i].SELECTED=='Y'){ arr.push(data[i].id); } } console.log(arr); // Do more stuffs here } ...

Improve slow angular directive

angularjs,ng-repeat,ng-init

The slowness you're experiencing could be due to the fact that after the window has been resized, a digest cycle isn't triggered. The fact that the view changes as all I suspect is due to the fact the digest cycle is later triggered by something else. To fix this, you...

ng-Repeat returning undefined within $scope.$watchCollection

Because $http.get is asynchronous so the line number 11 is executed before line number 5 so you get undefined there. By asynchronous i mean the execution doesn't wait for $http to return the promise, it just keeps executing to next lines....

Compare two arrays to get count of properties

Here is a generic approach. You provide the data and the field you want to count. var data = [ { name: 'Jon', age: 34 }, { name: 'Steve', age: 33 }, { name: 'Mark', age: 34 }, { name: 'Jon', age: 35 } ]; function countUnique(items, property) { return...

Uncommon “10 $digest iterations reached” case

angularjs,angular-ngmodel,angular-services,angularjs-ng-options

To answer your question directly, you can change the number of digest cycles as follows: app.config(function($rootScopeProvider){ $rootScopeProvider.digestTtl(20); }); But, I am cautious to recommend this as a general approach since, in all likelihood, the problem lies elsewhere your code (which is not specified in the question) and it just manifests...

navbar disappears but no dropdown

angularjs,bootstrap

This is built into bootstrap already. Viewing the html for bootstrap.com I see their button looks like this: <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#bs-navbar" aria-controls="bs-navbar" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> with the button they have data-target="#bs-navbar". "#bs-navbar" refers to...

ngOption default selected option

You have ng-options="product as product.formattedPrice+' - '+product.variantQualifierName for product in item[0] track by product.url" And $scope.productSelect = $scope.item[0]; So either you're trying to select out of one option or you're initializing your productSelected to the same array....

How to use a service with Http request in Angular JS

ofcservices.getnews() is a promise You need manage with the function sucess and error ofcservices.getnews(). success(function(data) { $scope.news=data }). error(function(data, status, headers, config) { //show a error }); As weel change app.factory('news' to app.factory('newsFactory' and call it in controller('news', function($scope, newsFactory) { You can get more data about promise in the...

AngularJS - binding/linking two directives together

The key issue revolves around your use of isolated scopes: scope: { selectedId: '=' }, With controllerAs binding: controllerAs: 'vm', What this essentially does, to put it basically, is it places the view model onto the directives scope, accessed through the alias you assign in the controllerAs. So basically in...

AngularJS dynamically call function

javascript,html,angularjs,angular-strap

seems like you have missed the argument for the controller method in the HTML // you have missed the event parameter. <input type="text" ng-model="value" ng-enter="hideToolTip(event)" /> app.directive('ngEnter', function() { return function(scope, element, attrs) { element.bind("keydown keypress", function(event) { if (event.which === 13) { console.log(attrs.ngEnter); scope.$apply( scope.$eval(attrs.ngEnter, { 'event': event })...

Angular-strap data-trigger='focus' not working

You can add a tabindex attribute to make a <span> focus-able. This also applies for <div> and <table> elements. The tabindex global attribute is an integer indicating if the element can take input focus (is focusable), if it should participate to sequential keyboard navigation, and if so, at what position....

I want to add an element inside an array, but not getting how to do this using angular

From the picture above I see that subChild is an object and not an array. So there are no functions like push() or concat() for an object. You can add a property to it like this childBD[i].subChild.busDomain = busDomain;

$http.get returns actual php script instead of running it (yeoman, grunt)

php,angularjs,pdo,gruntjs

Change $http.get('/scripts/php/articles.php') to $http.get('http://YOURDOMAIN.COM/scripts/php/articles.php') Off course you need to replace YOURDOMAIN.COM with localhost or any other domain you are using....

Angular error i dont understand?

The problem is you are using ng-bind-html-unsafe which has been deprecated form Angular 1.2+, you should replace it with ng-bind-html then you need to sanitize that html using $sce service using $sce.trustedAsHtml method. For that you should write your custom filter and apply that filter wherever you want display an...

how to call the application titles and other static messages from a service?

Angular: On button click to invoke controller

angularjs,angular-ui-router,ionic-framework,angular-ui,ionic

You can achieve this by using angular's $broadcast and $on methods to dispatch and listen for an event. First, update the markup of the selector to broadcast an event when selecting a schedule: <li><a ng-click="updateSchedule(value)">{{name}}</a></li> Second, in schedule-dropdown-controller inject $rootScope into your controller and add the updateSchedule method so the...

Ionic tabs : child view not showing

There is a working plunker It seems there is/are just a typo(s). And not just one! The first (already fixed in an edit of question) views : { 'tabs-users' ...} should be views : { 'tab-users' ...} The starting tab- instead of tabs- .state('tab.users', { url: '/users', views: { 'tab-users':...

calling one controller from another controller

You can normally use the controller in the modal open function but the controller2 must be in same module that controller1 belongs: angular.module('myModule').controller('controller1', ['$scope', myModuleController1]); angular.module('myModule').controller('controller2', ['$scope', myModuleController2]); or else you have to make your dependencies right in your app.js file if your controllers belong to separate modules myModule1, myModule2:...

Toggle Class to select offer with angular

javascript,arrays,angularjs,foreach

I have edit your code and when you select one it will add a class to that selected div and those other will not have that 'popular' class. $scope.selected = { id: 0 }; ng-class="{'popular': selected.id === abos.id }" http://codepen.io/anon/pen/EjbKQe?editors=101...

Merge and sum values and put them in an array

You cannot store key-value pair in array. Use object to store key-value pair. See comments inline in the code. var obj = {}; // Initialize the object angular.forEach(data, function(value, key) { if (value.start_date > firstdayOfWeek && value.start_date < lastdayOfWeek) { if (obj[value.firstname]) { // If already exists obj[value.firstname] += value.distance;...

AngularJS & Bootstrap Modal - loading template outside controller

angularjs,twitter-bootstrap,angular-bootstrap

A good way to reuse your template is to put it in a separate html file and put its url in templateUrl. So $modal can get it from server every time needed.

Value lookup on the fly in angular

You can create a function (e.g. getPostitOwner) on the scope that accepts an id as its param and returns the owner. You'd use it like this: <td><small>{{ postit.type }}</small></td> <td><small>{{ getPostitOwner(postit.owner).userName }}</small></td> As for the lookup function implementation: $scope.getPostitOwner = function (id) { for (var i = 0; i <...

AngularJS line break at points after a maximum length was reached