Search Posts

Category: angular-directive

How to pass the results from a rendered directive as variable to angular-translate

I have a (rather complex) directive that can render amounts in a currency. It formats the currency based on the rules of that currency (e.g. if a currency has cents etc.) and formats the number and symbol based on the locale. I’d like to use the outcome of the directive as a variable in a translation. There is a plunker with a simplified setup here In short, what I’d want: Your balance: <strong currency data-amount=”-1337″ […]

Added validation constraints to inputs dynamically, but Angular not initialising them

I have tried adding attributes such as ng-required=”true” and ng-pattern=”/^(d)+$/” dynamically as DOM is compiled by Angular. They are added and appear on the element when I inspect the element, however they do not appear to be initialised and do nothing. I did this using the directive below, I pass the inp object into the directive scope from the template as it’s compiled, the inp object contains all the data about how the input should […]

Unit test Angular directive and create two elements with specific scope.$id

I have a really strange task to compile two elements in my unit test and check them scope.$id. I try to explain at example 🙂 Directive code: import _ from ‘lodash’; export function ensureUniqueValues(resourcesStorage) { return { require: ‘ngModel’, link(scope, el, attrs, ngModel) { let stateValidation; const uniqueLabel = attrs.ensureUniqueValues.replace(/[-+()s]/g, ”); const setValidity = (element, state) => { element.model.$setValidity(‘ensureUniqueValues’, state); }; const validation = (value) => { console.log(‘resourcesStorage.resources’, resourcesStorage.resources); const filteredResources = _.filter(resourcesStorage.resources, { id: […]

Why does my angular1.6 controller not bind correctly when I have a break point

HB.Core.Directives.directive(‘hbMultiselect’, [ function() { return { restrict: ‘E’, templateUrl: ‘/hb-core/library/directives/hb-multiselect/hb-multiselect-ptl.html’, scope: {}, controllerAs: ‘$ctrl’, bindToController: { optionsData: ‘<‘, optionsSelected: ‘=’, allSubtypesSelected: ‘=’ }, controller: function() { var $ctrl = this; // $ctrl.$onInit = function() { // console.log(this); // Tried this… didn’t work either // }; function init() { $ctrl.isExpanded = false; $ctrl.optionsDisplay = []; $ctrl.tags = []; console.log(“——“) console.log($ctrl); console.log(“——“) >>>>>>>>>>>>>>>>>>>>**BREAK POINT HERE** } init(); } }; } ]); When I run the code without […]

Routing issue with angular directives

I’m trying to setup one of my first angular projects and am having trouble getting to grips with the routing. On page load I see the initial template that has been set by the preferencesDirective, which is great. When I click the “Change Template” button I want it to change to another template but nothing happens. If I set the template url’s in the $routeProvider to something invalid then I see a 404 error in […]