Tag: angularjs

AngularJS嵌套应用程序

我需要在另一个应用程序中嵌套应用程序，我正在寻找如何做到这一点的良好实践。 我有一个“userApp”来管理经过身份validation的用户的控制面板。 因此，未经过身份validation的用户的结构如下所示。 Login …. 登录由PHP管理，因此当用户登录时，他将被重定向到控制面板，结构如下所示。 User … …. 所以，现在我需要在这一个上定义一个主应用程序，由经过身份validation和未经过身份validation的用户共享，结构将如下所示。 User … …. 这两个应用程序不需要共享任何内容，只需要一个主应用程序来管理经过身份validation的用户和未经身份validation的用户之间的公共数据。 例如，可以管理导航栏，侧边栏，不同的ajax调用，但不关心用户是否经过身份validation（这是部分正确的，userApp可以设置localStorage变量，可以在userApp外部读取并且可以由mainApp管理）。 userApp有路由，mainApp没有。 我没有尝试过，但我很确定它会破坏，我正在寻找如何实现相同结果的最佳实践（我不想搞砸代码，两个月后发现这是一个弗兰肯斯坦….） 任何建议？ 这是可以实现的，或者我需要重新考虑结构并避免使用mainApp（比方说，我可以使用jQuery来做同样的事情……）。 我只是不想放弃userApp中的路由，如果可能的话，我不想在这个中更改任何内容，因为它是单独维护的，它已经准备就绪，并且已经过测试。 谢谢 编辑 看起来答案是没有AngularJS applications cannot be nested within each other. 所以我的问题是，是否可以在身体级别移动userApp并仅在用户通过身份validation时才使用路由，并且仅在控制面板中使用？ 例 / index /user#/控制面板 /user#/account angular route /some-url不是有角度的路线 /some-url/some-page not angular route

将angular.js中的JSON发送到node.js

如果我从前端angular.js发送JSON到backend node.js，它会给我一个错误： TypeError: Cannot read property username of undefined 。 我也用Express。 前端（Angular.js） ： var username_data = $scope.LoginUsername; var password_data = $scope.LoginPassword; var data = {username : username_data, password : password_data}; $http.post(‘/api/login’, data) .then(function (res) { //to do… }); 使用Restful API的后端（node.js）： app.post(‘/api/login’, function(req, res) { console.log(req.data.username); console.log(req.data.password); });

AngularUI中的Accordian标题图像

所以我目前将我的项目从jQuery移植到AngularJS，我在jQuery中有以下代码 jQuery代码 $(document).ready(function() { var icons = { header: “ui-icon-circle-arrow-e”, activeHeader: “ui-icon-circle-arrow-s” }; $( “#Session” ).accordion({ icons: icons }); }); 我在AngularUI中找不到任何图标选项。 是否有任何解决方法在AngularUI手风琴中添加标题图像？ 试图使用字体真棒的图标 Content Goes here 上面的代码在相邻的行上有图标和标题，而不是在同一行。

angular-bootstrap-slider将值作为字符串

使用基于bootstrap-slider的 angular- bootstrap-slider 。 我正在尝试按名称（字符串）获取颜色的值，基于我之前的问题，例如Here ，其中有一个很好的可用选项示例。 假设我有两种颜色选项，红色和蓝色，用户选择一个，我想将其保存为“蓝色”。 我在Plunker上创建了一个工作示例 ，并添加了下面的代码 如果我使用数字对象，我设法获得的是刻度值。 脚本： $scope.colorTypes = [0,1]; $scope.colorLabels = [‘Red’,’Blue’]; $scope.colorTypeSlider = { ticks: $scope.colorTypes, ticks_labels: $scope.colorLabels, ticks_snap_bounds: 50 }; $scope.colorTypeVal = ”; HTML： value check is: {{colorTypeVal}}

在ng-click里面的jQuery传递html元素引用

注意：不是上述副本。 上面是访问clicked元素，这个问题是关于访问不同的元素。 题 如何在ng-click中将我的html文档中的元素（不是单击的元素）传递给Angular范围方法？ 示例： http ： //jsfiddle.net/Ld8Zs/2/ HTML： One Two JavaScript的： var app = angular.module(‘myApp’, []); app.controller(‘myController’, function($scope) { $scope.clickHandler = function(el) { alert(typeof el); // real code work with element—set focus } }); 在此示例中，当您单击使用onclick的第二个按钮时，您将获得“对象”。 当您单击通过ng-click的第一个按钮时，您将获得“未定义”。 我试图避免将jQuery代码本身移动到控制器或一般的Angular中以保持可测试性。 编辑： 我的原始示例使用jQuery查找第一个元素，该元素很容易被$event处理。 这实际上并不表示我想解决的问题，而是将我的实际问题转化为简单的可重现性。 链接的重复项不是同一个问题。

单击后，Bootstrap下拉列表消失

Select SUT {{sutname.name}} 以上是我正在使用的bootstrap + angular下拉代码。 但是一旦我点击了下拉列表，它就会消失。 我正在使用angular1 + boostrap 3.3.7和jquery 1.12.4库。 没有使用其他脚本或js。 以下是角度函数 app.controller(“serviceHistoryController”,function($scope){ let menuitems = [{“sutid”:”1″,”name”:”AA”}, {“sutid”:”2″,”name”:”BB”}, {“sutid”:”3″,”name”:”CC”}, {“sutid”:”4″,”name”:”DD”}, {“sutid”:”4″,”name”:”EE”}] $scope.sutlist = menuitems; $scope.selectedSUT; $scope.sutselected = function(sutname){ $scope.selectedSUT = sutname; alert(“dropdown sut selected:”+$scope.selectedSUT.name); } });

使用jQuery从指令错误的元素高度

我是Angular的新手，我正在尝试使用jQuery从Directive做一些DOM计算和操作。 然而，我所拥有的是我元素的错误高度。 在我的情况下，元素就像容器 – 所以高度几乎都是视口高度。 directives.directive(‘responsiveAlerts’, [‘$log’, ‘$window’, function ($log, $window) { return { restrict: ‘A’, compile: function (element, attributes) { console.log($(‘.page’).height()); } }; }]); 我身高是46，这是错误的。 当我输入控制台时： $(‘.container’).height(); 因为页面已加载 – 我的容器高度正确。 有谁知道为什么会有这样的差异？ 提前谢谢了！

如何在JsPlumb小部件上启用resize？

我正在使用JSPlumb和AngularJS构建小部件列表，我需要使用每个小部件上的处理程序启用resize。 已经有一个example ，我已经实现了，但resize不会发生。 这是我的代码， HTML： App.js： routerApp.directive(‘resizeable’,function($compile){ return{ restrict: ‘A’, link: function(scope, element, attrs){ element.resizeable({ resize : function(event, ui) { jsPlumb.repaint(ui.helper); }, handles: “all” }); } }; 这是Plunker 实施pankajparkar代码后的输出， 我的实际小部件：

茉莉花unit testing元素不是：隐藏

我有一个AngularJS指令，我正在编写测试。 我已经在这个问题中重新创建了这个问题： http ：//plnkr.co/edit/gHoGwI6TZhsgKVwIb1uI？ p = preview 任何人都可以告诉我为什么第二次测试失败以及如何解决它？ 码： var app = angular.module(“myApp”, []); app.directive(“myDirective”, function() { return { template: “Hello this is my directive!” } }); describe(“Testing hidden”, function() { var $compile, $scope, $document; beforeEach(inject(function(_$compile_, $rootScope, _$document_){ $compile = _$compile_; $scope = $rootScope.$new(); $document = _$document_; })); function getElement() { var element = angular.element(“”); […]

AngularJS：ng-click in指令不在手机上触发

我目前正在努力克服AngularJS中的ng-click。 我有一个指令，并在一个带有ng-click-command的元素中。 {{room.name}} 如果我点击普通Chrome窗口，那么一切都很棒。 如果我使用Developer Tools模拟Nexus 7视图，则不会发生任何事情。 我正在使用AngularJS 1.2.16和jQuery 1.11.1。 我包含了ngTouchin我的应用程序依赖项，但它不起作用，我是否包括它… 我希望你们有一些想法。 问候