angularjs-directive

Goal: Create behaviors using directives with communication between 2 sibling elements (each their own directive). A behavior to use in example: The article content is hidden by default. When the title is clicked, I want the related article content to display. The catch: The related article elements need to associate to each other without being nested in a single parent element or directive. <div article="article1">this is my header</div> <div id="article1" article-content>this is content for the header above</div> <div article="article2">this is my header</div> <div id="article2" article

I need to test a directive that does some calls to some injected services. The following piece of code is an example directive, that listens for events, and redirects the browser if enter is pressed inside a specified element. Edit: I get the feeling I may be wading in E2E testing land? angular.module('fooApp') .directive('gotoOnEnter', ['$location', function ($location) { var _linkFn = function link(scope, element, attrs) { element.off('keypress').on('keypress', function(e) { if(e.keyCode === 13) { $location.path(scope.redirectUrl); } }); } return { restrict: 'A', link: _linkFn }; }]); The

What i am trying to do is simple. A user enters a value, on button click, my JS calls a service to retreive my JSON data and perform a search on the value entered against the JSON and if a match is found, display the 'Owner'. HTML: <div ng-app="myApp"> <div ng-controller="MainCtrl"> <input type="text" ng-model="enteredValue"> </br> <button type="button" ng-Click="findValue(enteredValue)">Search</button> </div> </div> JS: angular.module('myApp', []).controller('MainCtrl', function ($scope, $http, getDataService) { $scope.findValue = function(enteredValue) { alert("Searching for = " +

So I have this directive called say, mySave , it's pretty much just this app.directive('mySave', function($http) { return function(scope, element, attrs) { element.bind("click", function() { $http.post('/save', scope.data).success(returnedData) { // callback defined on my utils service here // user defined callback here, from my-save-callback perhaps? } }); } }); the element itself looks like this <button my-save my-save-callback="callbackFunctionInController()">save</button> callbackFunctionInController is for now just $scope.callbackFunctionInController = function() { alert("callback"); }

I'm creating a <row> AngularJS directive that needs to replace itself (the <row> tag must not be present in the DOM after execution) with a dynamic template that can contain any HTML code. The problem in using replace: true is that it does not work with table's <tr> tags and that the template is dynamically chosen. So I'm trying to find a way to replace the element in the linking function, with no success. Using jQuery's .replaceWith() breaks ngRepeat for unknown reason. Any hints? Here is the fiddle Your fiddle seems pretty basic but you should be able to just use outerHTML element[0]