angularjs-directive

AngularJS : Directive transcluded scope lost

由 |▌冷眼眸甩不掉的悲伤 提交于 2019-12-12 09:54:45
问题 I’m building a directive, I’m calling ‘requires-authorization’ to wrap an ng-if directive. I’d like to use it as follows: <requires-authorization role='SuperUser'> <!— super secret user stuff goes here, within the scope of this view's controller —> </requires-authorization> I’ve gotten as far as: angular.module('myApp').directive('requiresAuthorization', function() { return { template: '<div ng-if=\'iAmInRole\' ng-transclude></div>', restrict: 'E', transclude: true, scope: { role: '@' },

Set model value programmatically in Angular.js

由 China☆狼群 提交于 2019-12-12 09:52:11
问题 I'm an author of angular-input-modified directive. This directive is used to track model's value and allows to check whether the value was modified and also provides reset() function to change value back to the initial state. Right now, model's initial value is stored in the ngModelController.masterValue property and ngModelController.reset() function is provided. Please see the implementation. I'm using the following statement: eval('$scope.' + modelPath + ' = modelCtrl.masterValue;'); in

dynamically naming input controls in angularjs

由 僤鯓⒐⒋嵵緔 提交于 2019-12-12 09:46:28
问题 I have a input element which I am trying to name dynamically, but I had no luck so far using angular js. neither <input type="text" name="resource.Name" ng-model="resource.Value" ng-required="resource.IsRequired"> nor <input type="text" name="{{resource.Name}}" ng-model="resource.Value" ng-required="resource.IsRequired"> works for me. When I try to access name attribute it always comes back as resource.Name instead of the value it contains. The main reason I am trying to name this input

Disable jQuery Button with AngularJS and Form Validation

由 空扰寡人 提交于 2019-12-12 09:41:09
问题 I would like to disable my jQuery button based on form validation. According to the docs this is fairly easy with regular buttons using syntax such as: <button ng-click="save(user)" ng-disabled="form.$invalid">Save</button> However, when changing to a jQuery UI button this no longer works. I assume that Angular has no real binding between jQuery UI and AngularJS and thus would require a directive to do the following: $("button" ).button( "option", "disabled" ); Is that the case or are there

Angularjs adding dynamically form fields in various forms

由 邮差的信 提交于 2019-12-12 09:38:04
问题 Using ng-repeat I am creating bunch of forms with values in it. With each form there is also button to add rows to that particular form with new fields. Code is below HTML: <form name="{{form.name}}" ng-repeat="form in forms"> <h2>{{form.name}}</h2> <div ng-repeat="cont in form.contacts"> <input type="text" class="xdTextBox" ng-model="cont.ac"/> <input type="text" class="xdTextBox" ng-model="cont.a_number"/> <input type="text" class="xdTextBox" ng-model="cont.p_id"/> </div> <button ng-click=

AngularJS directive loaded dynamically in ng-include do not work

由 為{幸葍}努か 提交于 2019-12-12 09:28:28
问题 I have a custom directive which adds some html. myAppModule.directive('myDirective', function() { var linker = function(scope, element) { return element.html("<b>directive loaded</b>"); }; return { restrict: "E", rep1ace: true, link: linker, scope: false }; }); This directive is loaded and used in a dynamically loaded html which is included via ng-include . <script type="text/javascript" src="dynamicscript.js"></script> <my-directive>...</my-directive> But it does't work. The linker -function

How to modify transcluded content before compile inside directive?

由 假装没事ソ 提交于 2019-12-12 08:35:05
问题 What I want to do, is to handle transclude by hand and modify the content before I insert into the DOM: return { restrict: 'E', transclude: true, template: '<HTML>', replace: true, link: function(scope, element, attrs, ngModelCtrl, $transclude) { var caption = element.find('.caption'); $transclude(function(clone) { console.log(clone); clone.filter('li').addClass('ng-hide'); // this don't work clone.addClass('ng-hide'); // same this one clone.attr('ng-hide', 'true'); // same this one $compile

Accessing angular directive (element)'s text inside the template

由 会有一股神秘感。 提交于 2019-12-12 08:28:19
问题 So I am following this EggHead.io tutorial on custom components, and I came across this problem. When declaring a directive such as: angular.module('myApp', []) .directive('myDir', function(){ return { restrict: "E", controller: "myController", link: function(scope, element, attrs) { scope.foo = element.text(); }, templateUrl: "myDirTemplate.html" } }); and the Template being: <div>The value is: {{foo}}</div> and the directive being used such as follows: <html> ... <myDir>Bar</myDir> ... <

angularjs directive set template url dynamically

由 橙三吉。 提交于 2019-12-12 08:26:40
问题 I'm creating a directive with template URL. I want to set the template URL dynamically based on user_role. Any idea? Heres my directive code: RatingRX.directive "headermenu", -> directive = {} directive.restrict = 'E' directive.templateUrl = "../assets/common/headerMenu{{user_role}}.html" directive And I want to set user_role from the controller. Eg: $scope.user_role = 1 回答1: You can pass a function to the templateUrl option and return a string that will be used as a template url at the end.

Unit testing an AngularJS directive that watches an an attribute with isolate scope

由 只愿长相守 提交于 2019-12-12 08:22:29
问题 I have a directive that uses an isolate scope to pass in data to a directive that changes over time. It watches for changes on that value and does some computation on each change. When I try to unit test the directive, I can not get the watch to trigger (trimmed for brevity, but the basic concept is shown below): Directive: angular.module('directives.file', []) .directive('file', function() { return { restrict: 'E', scope: { data: '=', filename: '@', }, link: function(scope, element, attrs) {
订阅 angularjs-directive