Questions tagged «angularjs»

用于有关开源JavaScript框架AngularJS(1.x)的问题。不要将此标签用于Angular 2或更高版本;而是使用[angular]标签。

24
angularjs中的密码检查指令
我正在写一个密码验证指令: Directives.directive("passwordVerify",function(){ return { require:"ngModel", link: function(scope,element,attrs,ctrl){ ctrl.$parsers.unshift(function(viewValue){ var origin = scope.$eval(attrs["passwordVerify"]); if(origin!==viewValue){ ctrl.$setValidity("passwordVerify",false); return undefined; }else{ ctrl.$setValidity("passwordVerify",true); return viewValue; } }); } }; }); html: <input data-ng-model='user.password' type="password" name='password' placeholder='password' required> <input data-ng-model='user.password_verify' type="password" name='confirm_password' placeholder='confirm password' required data-password-verify="user.password"> 给定一个格式的2个密码字段,如果两个密码值相等,则该指令影响的字段有效。问题是它以一种方式起作用(即,当我在密码验证字段中键入密码时)。但是,当原始密码字段更新时,密码验证无效。 知道如何进行“双向绑定验证”吗?

4
我怎样才能使AngularJS指令stopPropagation?
我试图“ stopPropagation”以防止单击li内的元素(链接)时关闭Twitter Bootstrap导航栏下拉菜单。使用这种方法似乎是常见的解决方案。 在Angular中,看起来像指令是执行此操作的地方?所以我有: // do not close dropdown on click directives.directive('stopPropagation', function () { return { link:function (elm) { $(elm).click(function (event) { event.stopPropagation(); }); } }; }); ...但是该方法不属于元素: TypeError: Object [object Object] has no method 'stopPropagation' 我把指令与 <li ng-repeat="foo in bar"> <div> {{foo.text}}<a stop-propagation ng-click="doThing($index)">clickme</a> </div> </li> 有什么建议么?

6
更改服务数据时更新范围值
我的应用程序中提供以下服务: uaInProgressApp.factory('uaProgressService', function(uaApiInterface, $timeout, $rootScope){ var factory = {}; factory.taskResource = uaApiInterface.taskResource() factory.taskList = []; factory.cron = undefined; factory.updateTaskList = function() { factory.taskResource.query(function(data){ factory.taskList = data; $rootScope.$digest console.log(factory.taskList); }); factory.cron = $timeout(factory.updateTaskList, 5000); } factory.startCron = function () { factory.cron = $timeout(factory.updateTaskList, 5000); } factory.stopCron = function (){ $timeout.cancel(factory.cron); } …
76 angularjs 

4
带有html5Mode的Angularjs普通链接
我正在html 5模式下使用angularjs。似乎可以控制页面上的所有href。但是,如果我想链接到该应用程序同一域中但实际上不在该应用程序中的内容,该怎么办?一个示例是pdf。 如果我做的<a href="https://stackoverflow.com/pdfurl">角度会尝试使用html5mode并使用路由提供程序来确定应加载哪个视图。但是我实际上希望浏览器以常规方式转到该页面。 唯一的方法是与路由提供者制定规则,并使用window.location将其重定向到正确的页面吗?
76 angularjs 

4
响应式下拉导航栏,带有angular-ui引导程序(以正确的角度方式完成)
我使用angular-ui-boostrap的模块“ ui.bootstrap.dropdownToggle”创建了带有下拉导航栏的JSFiddle:http : //jsfiddle.net/mhu23/2pmz5/ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> <a class="brand" href="#"> My Responsive NavBar </a> <ul class="nav"> <li class="divider-vertical"></li> <li class="dropdown"> <a href="#" class="dropdown-toggle"> Menu 1 <b class="caret"></b> </a> <ul class="dropdown-menu"> <li><a href="#/list">Entry 1</a> </li> <li><a href="#/list">Entry 2</a> </li> </ul> </li> .... </ul> </div> </div> </div> 据我了解,这是实施此类下拉菜单的正确方法。就angularjs而言,“错误”方式将包括bootstrap.js并使用“ …



4
从参数对象构建查询字符串
如何在Angularjs中使用查询参数构建URL。 我看到了API $ location.search() 问题是$ location(url)是重定向到url。就我而言,我想为查询参数传递url和key:value对,并构建url。就像是 网址:/a/b/c params:{field1: value1, field2: value2} 结果: /a/b/c?field1=value1&field2=value2 我喜欢使用此URL进行链接。我也见过角度编码?,&字符。我可以避免吗? 编辑: 我的意图是将URL用作锚元素的href。我确实使用$ http发送请求,但有时我需要提供一个链接,其中包含查询参数(基于当前对象) 谢谢

3
带角度ng-click并调用控制器功能不起作用
我需要将变量传递给另一个控制器。我有以下与ListCtrl相关的代码: <a href="#items" data-router="article" ng-click="changeListName('metro')"> 链接将转到另一个控制器ItemCtrl。 我想将变量传递给ItemCtrl。我想到了使用一个名为SharedProperties的服务: service('sharedProperties', function () { var list_name = ''; return { getListName: function() { return list_name; }, setListName: function(name) { list_name = name; } }; }); 单击链接后,我将调用角度单击事件以触发以下功能: $scope.changeListName = function(name) { sharedProperties.setListName(name); }; 但是,ng-click似乎并没有改变我共享属性的值... 更新 我在ng-click触发的函数中放置了一个警报,并且警报应该被触发。 但是,当我这样编写函数时: $scope.changeListName = function(name) { sharedProperties.setListName(name); }; 它不起作用...看起来像“ …
76 angularjs 

1
_servicename_中的下划线在AngularJS测试中意味着什么?
在下面的示例测试中,原始提供程序名称为APIEndpointProvider,但是对于注入和服务实例化,似乎必须使用下划线将其注入。这是为什么? 'use strict'; describe('Provider: APIEndpointProvider', function () { beforeEach(module('myApp.providers')); var APIEndpointProvider; beforeEach(inject(function(_APIEndpointProvider_) { APIEndpointProvider = _APIEndpointProvider_; })); it('should do something', function () { expect(!!APIEndpointProvider).toBe(true); }); }); 我缺少更好的解释的约定是什么?

2
绑定和摘要在AngularJS中如何工作?
使AngularJS与其他JavaScript-MVC框架区分开的一件事是,它能够使用绑定将JavaScript中的绑定值回传到HTML。当您为$ scope变量分配任何值时,Angular会“自动”执行此操作。 但是,这有多自动化?有时,Angular不会接受更改,因此我需要调用$ scope。$ apply()或$ scope。$ digest()来通知angular来获取更改。有时,当我运行这些方法中的任何一个时,都会引发错误并指出摘要已在进行中。 由于绑定({{}}花括号或ng属性中的任何内容)都用eval回显,那么这是否意味着Angular会不断轮询$ scope对象以查找更改,然后执行eval将这些更改推送到DOM / HTML?还是AngularJS以某种方式想出了使用魔术变量来触发事件,这些事件在变量值更改或分配时触发?我从未听说过所有浏览器都完全支持它,所以我对此表示怀疑。 AngularJS如何跟踪其绑定和范围变量?
76 angularjs 

4
在AngularJS中单击按钮后打开一个新选项卡
<button type="button" class="btn btn-primary" ng-click="openTab()">new tab</button> openTab = function () { $http.post('www.google.com'); } 我想要的是发布一个需求,然后单击“ openTab”按钮时在新选项卡中打开响应html。无法使用来执行此操作$http。我认为这可能很简单,但我找不到办法。

3
测试自定义验证angularjs指令
此自定义验证指令是官方角度网站上提供的示例。 http://docs.angularjs.org/guide/forms会 检查文本输入是否为数字格式。 var INTEGER_REGEXP = /^\-?\d*$/; app.directive('integer', function() { return { require: 'ngModel', link: function(scope, elm, attrs, ctrl) { ctrl.$parsers.unshift(function(viewValue) { if (INTEGER_REGEXP.test(viewValue)) { // it is valid ctrl.$setValidity('integer', true); return viewValue; } else { // it is invalid, return undefined (no model update) ctrl.$setValidity('integer', false); return undefined; } …


2
AngularJs将复杂数据传递给指令
我有以下指令: <div teamspeak details="{{data.details}}"></div> 这是对象结构: data: { details: { serverName: { type: 'text', value: 'my server name' }, port: { type: 'number', value: 'my port' }, nickname: { type: 'text' }, password: { type: 'password' }, channel: { type: 'text' }, channelPassword: { type: 'password' }, autoBookmarkAdd: { type: 'checkbox' …
76 angularjs 

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.