angularjs-directive

问题 I've been struggling with Angular's isolate scope for over 24hrs now. Here's my scenario: I have an ng-repeat iterating over an array of objects from which I want to use a custom directive to either generate a <select> or <input> based on the field_type property of the current object being iterated. This means I'll have to generate the template and $compile in the post-link function of the directive since I have no access to the iterated object in the template function. Everything works as

问题 I'm doing a directive for input mask. But, when I pass a string as value the attribute is undefined. If I pass directly the mask It's working. .directive('inputMask', function () { return { restrict: 'EAC', scope: true, link: function (scope, element, attrs) { scope.$watch('inputMask', function (newVal) { console.log('inputMask', newVal); }); var maskType = scope.$eval(attrs.inputMask); switch (maskType) { case 'phone': $(element).inputmask("phone", { url: '@Url.Content("~/Scripts/jquery

问题 Why value of the ng-model is not updated with the expression. Before ng-model is defined value get updated Value will be updated as soon as phase2 or phase3 changes <input type="text" name="phase1" value="{{phase2 - phase3}}" ></input> Value will not be updated <input type="text" name="phase1" value="{{phase2 - phase3}}" ng-model="phase1"></input> So I think of writing a directive which will evaluate the expression inside the directive and updated the output to model, Here is html it will

问题 How can I access controller scope from multi-level directives in below structure: I create a directive that has multi-level scopes inside its. 1. Controller scope 1.2. Directive1 scope(main directive) 1.2.1. Directive2 scope 1.2.1.1 Directive3 scope I want to get the controller scope from directive 3. please don't refer to $parent because the parent level it's not certain and a user may use this directive inside another directive.(see below codes) <div ng-controller="Test"> <custom-dir> <dir1

问题 In first case : I implemented a directive directive2 that will change bar value which will also get reflected in directive1 . Here u can find the plunkr (1st case) In second case :I implemented a directive directive2 , with ng-repeat used along with this directive that changes bar value and this is supposed to get reflected in directive1 . Here u can find the plunkr for directive2 with ng-repeat (2nd case) How i expect it to work : i want the bar in directive1 to change according to the

问题 I have coded a simple example where I want to emit/broadcast an event from a service and I want that event to be listened by a controller and change the UI, but I can't make it work and debugging the code it seems to stop in the listener but it doesn't execute the function. http://plnkr.co/edit/eglcq7zELLfKp86DYzOe?p=preview service: angular.module('ServiceModule', []). service('servicetest', ['$rootScope', function($rootScope){ this.test = function(){ $rootScope.$emit('testevent'); }; }]);

问题 I have a fairly simple UI control that I've modeled as a directive, which is an editor for phone numbers that has two input fields: one for the country code and another for the number. The directive's usage looks like this: <phone-editor ng-model='phoneNo'></phone-editor> In the directive's declaration, I require ngModel and the template looks like this: <input type="text" ng-model="countryCode" /> <input type="text" ng-model="number" /> It's clear how to compose and decompose the original

问题 In my app I have window instances. The app can contain multiple windows and windows can contain multiple views. The views are children of each window instance. The windows and view creator are directive with an isolated scope. I want the views to be loosely coupled to their parent window and not have to something like $scope.$parent module.directive('window', function() { return { restrict: 'E', replace: true, templateUrl: 'windowTemplate.html', controller: 'windowController', scope: { config

问题 I want users of my web application to be presented with an progress bar indicating current progress of loading files and scripts necessary. Preferably showing percentage, but a simple loader gif is an acceptable solution. What is the best way to implement a loader that could show an indication of percentage finished loading images, css and js in Angular, if at all possible? I'm thinking of having a small application whose only purpose is to load resources and indicate progress, and when all

问题 I am implementing a form builder in AngularJS and need to insert and reorder directives at runtime. Don't even know where to start looking - all examples seem to only demonstrate static tree of directives. Two options to achieve dynamic behaviour are: a) compiling and inserting templates on the fly and b) using huge ng-switch of all possible directives. Both ways are ugly. Can anyone suggest a better implementation? Below is JS and html code for how I think formbuilder should look in an ideal