Latest Angular.js Recipes

AngularJS - How to get serverside and clientside routing to work together

Im working on porting a project over to an angular based SPA. Its currently a more "traditional" node/locomotivejs app that serves up templates from the server side (never known the proper term for this).

The projects too large to to migrate all at...

Read the entire recipe Recipe added 35 minutes ago

UI-Router: sequential resolve of parent and child states

I have two abstract states parent and parent.child, and an activateable state parent.child.grand.

I want parent to be promise resolved before parent.child.grand gets its resolves executed. Why? Because a certain data which comes from the ajax request...

Read the entire recipe Recipe added 1 hour, 33 minutes ago

Angular UI Bootstrap modal inside ngRepeat

I am making an app, where I have a lot of input fields. Those input fields are generated from JSON object array field with AngularJS ngRepeat directive and have a button next to them which open an Angular UI Bootstrap modal to edit this value in a...

Read the entire recipe Recipe added 2 hours, 28 minutes ago

Angularjs route with hidden parameters like a http post

Can I get hidden parameters like a http post with $location?

Concept of what I'm thinking:

$location.param(key, value);
$location.path('/myPLace');

Read the entire recipe Recipe added 3 hours, 31 minutes ago

Angularjs Multiple directives [gridsection, gridsection] asking for template on: <div gridsection="">

I'm receiving the error: Multiple directives [gridsection, gridsection] asking for templateon : <div gridsection=""> with this code.

I don't see how i'm using nested directives or what is causing this.

html page

<div gridsection...

Read the entire recipe Recipe added 4 hours, 32 minutes ago

AngularJS: Factory is always undefined when injected in controller

I am trying a simple example of an AddressBook Angular application. I have a factory that returns an array of records and it it gets displayed in a list view using a List controller

angular.module('abModule', ['ngRoute'])
.factory('AddressBook',...

Read the entire recipe Recipe added 5 hours, 34 minutes ago

angularjs : @mention in textarea

I want to display an autocomplete form triggered by the word @ in my textarea like this library http://ichord.github.io/At.js/ but only using angularjs & css

What kind of directive should I write ? Also, is there a way to implement this with the...

Read the entire recipe Recipe added 6 hours, 28 minutes ago

Send data to controller on ui.select angular

i'm trying to select a value from dropdown list and get the data from corresponded select id in angularJs

i have came up with angular-ui/ui-select directives

<ui-select ng-model="customer" theme="selectize">
     <ui-select-match...

Read the entire recipe Recipe added 7 hours, 30 minutes ago

AngularJS - Upgrading v1.2.5 to 1.3 to use bind once

I am trying to improve the performance of my ng-repeat's. I have upgraded my project to use library v1.3.0 (main lib and route).

I am trying to use the bind once as here: Do bindings nested inside of a lazy one-time ng-repeat binding bind just...

Read the entire recipe Recipe added 8 hours, 27 minutes ago

Getting error &quot;Failed to instantiate module app due to unknown provider&quot; with my custom provider

Trying to create custom provider and use it during app config. During configuration phase getting an error "Failed to instantiate module app due to unknown provider 'configRoutesProvider'". Provider code:

    (function () {
    'use strict';

   ...

Read the entire recipe Recipe added 9 hours, 27 minutes ago

Watch variable and change it

In AngularJS I have a directive that watches a scope variable. When the variable contains certain data then I need to alter that variable a bit. The problem is that when I change the variable that my $watch is triggered again. So I end up in a...

Read the entire recipe Recipe added 10 hours, 35 minutes ago

Nested directive and ng-repeat exception TypeError: Cannot read property &#39;insertBefore&#39; of null

I am learning angularjs by developing map directives. The most outer directive is myMap, then myCircle, myMarker, etc.... are the child directives. At this time, I have only the myMap and myCirle directives. The map and circles works fine if I dont...

Read the entire recipe Recipe added 11 hours, 30 minutes ago

C# Web API routing mixed with Angular routing

Is it possible to make an MVC application use routing only form WEB API, but then allow angular to do the rest of the routing using its routeprovider? When I run my application I get:

GET http://localhost:8080/Views/Home/Index.html 404 (Not Found)...

Read the entire recipe Recipe added 12 hours, 31 minutes ago

How can I show and hide an element with AngularJS while having it still use space?

I have a button in AngularJS. It's in a row of other buttons. How can I show and hide this button but still have it use space? I tried using ng-show but then when the button is hidden it uses no space and all the other buttons around it move.

Read the entire recipe Recipe added 13 hours, 30 minutes ago

AngularJS ng-model value is lost after custom validation directive is triggered

I created a custom validation directive and used it in a form. It can be triggered with no problem, but after the validation is triggered, I found that the model value is just lost. Say I have

ng-model="project.key" 

and after validation,...

Read the entire recipe Recipe added 14 hours, 28 minutes ago

AngularJS UI Router $state reload child state only

I am using UI router for tabs of a main menu as well as for links within one of the states (users). The users state has a list of users and when a user is clicked, I want to reload the child state only, but it is reloading both the child state and...

Read the entire recipe Recipe added 15 hours, 32 minutes ago

angular ng-repeat inside of ng-repeat not working in table

I have the following

 <tbody ng-repeat="history in orderHistory">
        <tr>
            <td>{{history.reference_code}}</td>
            <div ng-repeat="items in history.orderedItems">
                <td>{{items.product_description}}</td>
        ...

Read the entire recipe Recipe added 16 hours, 33 minutes ago

Year Picker in popup with angular-ui bootstrap

I'm trying to have a year picker using the angular-ui Bootstrap datepicker directive.

It works when it is inline, but not in the popup. Setting the options via datepicker-options doesn't matter for the popup.

See this Plunker: ...

Read the entire recipe Recipe added 17 hours, 32 minutes ago

Protractor Check if Element Does Not Exist

I have a setting in my angular based website that turns a dropdown on and off. If it is off, then it does not show on the main page.

With Protractor, I need to check to see if this element is not present when the switch is off. However, I should not...

Read the entire recipe Recipe added 18 hours, 32 minutes ago

How to test rendering speed in Angular

We're building an Angular app, and we're trying to figure out how to get some benchmarks on how long it takes to render various pages. I've read about performance.timing here, but that seems to only be useful with non-single page applications as when...

Read the entire recipe Recipe added 19 hours, 32 minutes ago

ionic framework two popups in tandem

I have an ionic app where the user taps a button, then a popup shows up and then the user taps a button in the popup and another one shows up. This works fine in the browser but when I deploy it to an android device, after the second popup closes the...

Read the entire recipe Recipe added 20 hours, 27 minutes ago

making table cell active using ng-click with ng-repeat

Problem: I have a table and a clickable <td>. What I want to happen is when I clicked on any of the following <td> It will become active but I can't do it right.

DOM

<table class="table-position">
  <tr ng-repeat="i in [1,2,3]">
    <td...

Read the entire recipe Recipe added 21 hours, 28 minutes ago

Angular hide alert message again after x seconds or page change

I'm quite new to angular, now I was able to show an alert message when someone requests a new password, from our app:

Usermodel:

.service('userModel', ['$q', '$http', 'authorizedTracker', function($q, $http, authorizedTracker) {
   ...

Read the entire recipe Recipe added 22 hours, 32 minutes ago

Matching one or more alphanumeric characters with AngularJS

I have an AngularJS app. Why does the pattern /^[a-zA-Z0-9]+$/ match an empty string?

<form name="addTeamForm" novalidate ng-init="team=''">
  <input type="text" name="team" ng-model="team" ng-pattern="/^[a-zA-Z0-9]+$/"/>
</form>
{{...

Read the entire recipe Recipe added 23 hours, 34 minutes ago

Angular ui-bootstrap progressbar with angular-timer not showing value

Please help. I am fresh out of sanity.

See codepen here for an example.

I have a <timer> from angular-timer that exposes seconds on to the local scope and updates it every second, which is pretty nice. Something like this:

<timer> {{seconds}}...

Read the entire recipe Recipe added 1 day ago