angularjs-directive

Can I use a JQuery plugin from within an angularjs directive?

╄→гoц情女王★ 提交于 2019-12-13 17:12:29
问题 I'm quite new to javascript in general. I've spent the past couple of weeks building a front end with Angular.js. I have a number of directives I've defined that sit on my page, Angular has been great for this. Here's what my main page looks like: <body class="body" ng-controller="OverviewController as overview" font-size:1em> <sidebar-menu ng-controller="PanelController as panel"></sidebar-menu> <div id="content" > <div> <div class="list-group"> <div class="list-group-item" ng-repeat="site

Long $compile duration, understanding the nature of the delay in AngularJs

倖福魔咒の 提交于 2019-12-13 17:10:04
问题 I have a problem which I have recently found myself obsessed with, see, I extreamly Now need you to show me the way of working the problem out. My business task was to create a list of posts with comments to each of them. Each post have 3 state: view, edit and deleted. I've created directives Post and Comment . I've also created PostList and CommentList directives to manage Posts and Comments. Post and Comment are similar code: http://plnkr.co/edit/k77kdSwPnqY4jR5EY7N4?p=preview app.directive

How to use a scope in Directive template

本秂侑毒 提交于 2019-12-13 17:05:57
问题 I want to use $scope variable in template function of directive like this. In the other words i want to generate directive template inside of directive and by using $scope variable. Help me to connect template function to controller. directive("data", ['$compile', '$http', '$templateCache',function ($http,$rootScope) { return{ link: function (scope, elem, attrs, ctrl) { scope.template = something // I want Generate template here }, template:function(element , attrs){ return $scope.template //

AngularJS directive in ng-bind-html

拜拜、爱过 提交于 2019-12-13 17:04:23
问题 In the application I am working on, a service supplies the app with a json, containing HTML. I output the HTML in a template like this: <div ng-bind-html="renderHtml(widget.article.body)"></div> This HTML may contain custom directives, like an inline-chart: directiveModule.directive('inlineChart', function(){ return { restrict: 'A', scope: { inline-widget:'=elem' }, template: '<p ng-bind="inline-widget.blah"></p>' }; }); If I use the directive normally in a template, everything works fine,

Using $compile in a directive triggers AngularJS infinite digest error

做~自己de王妃 提交于 2019-12-13 16:26:39
问题 Any thoughts on why this directive is triggering an infinite digest error? http://jsfiddle.net/smithkl42/cwrgLd0L/13/ var App = angular.module('prettifyTest', []); App.controller('myCtrl', function ($scope) { $scope.message = 'Hello, world!'; }) App.directive('prettify', ['$compile', function ($compile) { var template; return { restrict: 'E', link: function (scope, element, attrs) { if (!template) { template = element.html(); } scope.$watch(function () { var compiled = $compile(template)

How to pass ngRepeat “template” to a ngDirective using transclude?

送分小仙女□ 提交于 2019-12-13 15:29:42
问题 Demo: http://plnkr.co/edit/TiH96FCgOGnXV0suFyJA?p=preview I have a ng-directive called myDirective and within the directive template I have a list of li tags printed using ng-repeat. I want to declare the content of li tag as part of the declaration of myDirective and use transclude to print the desired text / html content. This way I can have a nice separation of concerns so that my directive doesn't need to know the structure of the source item, and it'll be the caller's responsibility to

How can I render an Angular directive in a popup window, allow it to communicate with the main window?

别来无恙 提交于 2019-12-13 15:07:50
问题 Users of my app want to be able to detach certain application components from the SPA and move them onto their second monitor while retaining their functionality. What I don't want is to load the entire SPA in a popup window just to show this one view. I've found that I can append a template to a popup window's body and $compile it there using the scope from the main window. This mostly works, but any directive that uses the 'require' syntax will ultimately fail because where ever Angular is

Bind function on key up in Angular

ぐ巨炮叔叔 提交于 2019-12-13 14:18:18
问题 I am a designer/front-end developer and have little to no experience with Angular, so I'm hoping to get some help here. I have the following html <div class="dropdown"> <div class="options"></div> <div class="add"> <i id="add-issue-plus" class="icon-plus" data-ng-click="addIssue($event)"></i> <input id="add-issue-field" data-ng-model="newIssueName" type="text" placeholder="Create a new issue"/> </div> </div> I would like to trigger the click event from the <i> element if the user presses

How to remove module not found error in angular?

£可爱£侵袭症+ 提交于 2019-12-13 12:42:32
问题 I make a simple example of controller here . http://plnkr.co/edit/dplJ6sf4kgiwJ5pXu4GE?p=preview and I want to test the controller .I am able to test my controller online Here is my code to test my controller online http://plnkr.co/edit/xzvhXHPoUdulOM9clOkQ?p=preview But when I try to run that same work on my computer my test case are fail I am getting error this Module 'app.home' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that

Display Loading Icon or Loading Progress Bar using angularjs

Deadly 提交于 2019-12-13 12:29:18
问题 How to display the loading Icon or loading Progress bar using angularjs. I mean something like this which used in jquery $("body").addClass("loading"); , $("body").removeClass("loading"); , I saw some links for progress bar which is of like youtube loading bar but i don't want like that I want simple progress bar or loading iage or loading icon or loading bar which show bar moving from module to module, tabs to tabs. Is there any link or function which explain clearly how to use it. 回答1: if