Questions tagged «angularjs»

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

2
AngularJS中具有ng-repeat范围的指令隔离范围
我有一个带有隔离范围的指令（以便我可以在其他地方重用该指令），当我将此指令与一起使用时ng-repeat，它将无法正常工作。 我已经阅读了有关此主题的所有文档和Stack Overflow的答案，并了解了这些问题。我相信我避免了所有常见的陷阱。 因此，我知道我的代码由于ng-repeat指令创建的作用域而失败。我自己的指令创建了一个隔离范围，并与父作用域中的对象进行了双向数据绑定。我的指令将为该绑定变量分配一个新的对象值，并且在不使用我的指令的情况下ng-repeat（父变量已正确更新），这可以完美地工作。但是，使用时ng-repeat，赋值将在ng-repeat作用域中创建一个新变量，并且父变量看不到更改。所有这些都是根据我所读的内容预期的。 我还读到，当给定元素上有多个指令时，只会创建一个作用域。并且priority可以在每个指令中设置a，以定义指令的应用顺序；指令按优先级排序，然后调用其编译功能（在http://docs.angularjs.org/guide/directive中搜索优先级一词）。 因此，我希望可以使用优先级来确保我的指令先运行并最终创建一个隔离范围，并且在ng-repeat运行时，它会重新使用隔离范围，而不是创建一个原型上从父范围继承的范围。该ng-repeat文件指出，在优先级别的指令运行1000。不清楚1是较高优先级还是较低优先级。当我1在指令中使用优先级时，它没有什么不同，因此我尝试了2000。但这使情况变得更糟：我的双向绑定变为undefined，我的指令不显示任何内容。 我制造了一个小提琴来展示我的问题。我已经priority在指令中注释掉了设置。我有一个名称对象列表和一个名为的指令，该指令name-row显示名称对象中的名字和姓氏字段。单击显示的名称时，我希望它selected在主作用域中设置一个变量。名称数组，selected变量name-row使用双向数据绑定传递给指令。 我知道如何通过在主作用域中调用函数来使其工作。我也知道，如果selected在另一个对象内部，并且绑定到外部对象，则一切正常。但是我目前对这些解决方案不感兴趣。 相反，我的问题是： 如何防止ng-repeat创建从父作用域继承的原型作用域，而使用我的指令的isolate-scope？ 为什么2000我的指令中的优先级不起作用？ 使用Batarang，是否可以知道正在使用哪种类型的示波器？
4
从指令中调用控制器函数，而AngularJS中没有隔离范围
我似乎无法找到一种无需使用隔离范围就可以在指令中从父范围调用函数的方法。我知道，如果我使用隔离作用域，则可以在隔离作用域中使用“＆”来访问父作用域上的函数，但是在不必要时使用隔离作用域会产生后果。考虑以下HTML： <button ng-hide="hideButton()" confirm="Are you sure?" confirm-action="doIt()">Do It</button> 在这个简单的示例中，我想显示一个JavaScript确认对话框，并且仅当他们在确认对话框中单击“确定”时才调用doIt（）。使用隔离范围很简单。该指令如下所示： .directive('confirm', function () { return { restrict: 'A', scope: { confirm: '@', confirmAction: '&' }, link: function (scope, element, attrs) { element.bind('click', function (e) { if (confirm(scope.confirm)) { scope.confirmAction(); } }); } }; }) 但是问题是，因为我使用的是隔离范围，所以上例中的ng-hide不再针对父范围执行，而是在隔离范围内执行（因为在任何指令上使用隔离范围都会导致该元素上的所有指令使用隔离范围）。这是上面示例的jsFiddle，其中ng-hide不起作用。（请注意，在此小提琴中，当您在输入框中键入“是”时，按钮应该隐藏。） 另一种选择是不使用隔离范围，这实际上是我在这里真正想要的，因为不需要将此指令的范围隔离。我唯一的问题是，如果不在隔离范围内传递方法，该如何在父范围内调用方法？ 这是一个我没有使用隔离范围的jsfiddle，而ng-hide可以正常工作，但是，当然，对confirmAction（）的调用不起作用，并且我不知道如何使它起作用。 请注意，我真正要寻找的答案是如何在不使用隔离范围的情况下在外部范围内调用函数。而且我对使该确认对话框以另一种方式工作不感兴趣，因为该问题的重点是弄清楚如何对外部作用域进行调用，并且仍然能够使其他指令在父作用域内起作用。 另外，如果其他指令仍然可以对父作用域起作用，那么我会很想听到使用隔离作用域的解决方案，但是我认为这是不可能的。
2
从AngularJS指令访问属性
我的AngularJS模板包含一些自定义HTML语法，例如： <su-label tooltip="{{field.su_documentation}}">{{field.su_name}}</su-label> 我创建了一个指令来处理它： .directive('suLabel', function() { return { restrict: 'E', replace: true, transclude: true, scope: { title: '@tooltip' }, template: '<label><a href="#" rel="tooltip" title="{{title}}" data-placement="right" ng-transclude></a></label>', link: function(scope, element, attrs) { if (attrs.tooltip) { element.addClass('tooltip-title'); } }, } }) 一切正常，但attrs.tooltip表达式始终返回undefined，即使tooltip在执行时从Google Chrome浏览器的JavaScript控制台可见该属性，该表达式始终返回console.log(attrs)。 有什么建议吗？ 更新：Artem提供了一种解决方案。它包括这样做： link: function(scope, element, attrs) { attrs.$observe('tooltip', …
9
Chai：如何使用“ should”语法测试未定义
在本教程中使用chai测试angularjs应用程序的基础上，我想使用“应该”样式为未定义的值添加测试。这将失败： it ('cannot play outside the board', function() { scope.play(10).should.be.undefined; }); 错误为“ TypeError：无法读取未定义的属性”应该”，但测试以“期望”样式通过： it ('cannot play outside the board', function() { chai.expect(scope.play(10)).to.be.undefined; }); 我如何使其与“应该”一起使用？
1
Angular $ q。如何工作？
有人可以解释一下$q.when在AngularJS中如何工作吗？我正在尝试分析$http工作方式并发现了这一点： var promise = $q.when(config); 这是来自Chrome控制台的配置对象： Object {transformRequest: Array[1], transformResponse: Array[1], cache: Object, method: "GET", url: "/schedule/month_index.html"…} cache: Object headers: Object method: "GET" transformRequest: Array[1] transformResponse: Array[1] url: "/schedule/month_index.html" __proto__: Object 接下来发生什么？如何解决或拒绝该对象？
95 angularjs  deferred  q 
7
如何在jsfiddle中调试js
我正在看这个jsfiddle：http : //jsfiddle.net/carpasse/mcVfK/ 可以正常工作，这不是问题，我只想知道如何通过javascript进行调试。我尝试使用调试器命令，但在“源”选项卡中找不到它？知道我该如何调试吗？ 小提琴的一些代码： angular.module('app', ['appServices']) .config(['$routeProvider', function($routeProvider) { $routeProvider. when('/home', {templateUrl: 'home.html', controller: HomeCtrl}). when('/list', {templateUrl: 'list.html', controller: ListCtrl}). when('/detail/:itemId', {templateUrl: 'detail.html', controller: DetailCtrl}). when('/settings', {templateUrl: 'settings.html', controller: SettingsCtrl}). otherwise({redirectTo: '/home'}); }]);
8
在标记中设置角度范围变量
一个简单的问题：如何在html中设置作用域值，以供控制器读取？ var app = angular.module('app', []); app.controller('MyController', function($scope) { console.log($scope.myVar); }); <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app='app'> <div ng-controller="MyController" app-myVar="test"> {{myVar}} </div> </div> 运行代码段隐藏结果展开摘要 JSFiddle：http : //jsfiddle.net/ncapito/YdQcX/
3
具有自定义过滤功能的AngularJS多重过滤器
我正在尝试使用多个过滤器+自定义过滤器功能过滤列表。 最初工作的jsfiddle示例是http://jsfiddle.net/ed9A2/1/，但是现在我想更改年龄过滤的方式。 我想添加一个自定义过滤器，以使其年龄基于两个输入值min_age和max_age（在年龄之间）进行过滤。 在研究文档之后。我发现有人有类似的问题，用户Mark Rajcok回答了http://docs.angularjs.org/api/ng.filter:filter#comment-648569667看起来不错，应该可以工作。但是我在将其应用于我的代码时遇到了问题，这主要是因为我还有其他多个过滤器。 我对AngularJS非常了解:( 我尝试过但不起作用的小提琴在这里http://jsfiddle.net/ed9A2/20/ 我的无效代码的副本粘贴在这里 视图 <div ng-app ng-controller="MainController"> <table class="fancyTable"> <tr> <th>Player id</th> <th>Player name</th> <th>Age</th> </tr> <tr> <td><input ng-model="player_id" /></td> <td><input ng-model="player_name" /></td> <td> Min Age:<input ng-model="min_age" /> Max Age:<input ng-model="max_age" /> </td> </tr> <tr ng-repeat="player in players | filter:{id: player_id, name:player_name, age:ageFilter}"> <td>{{player.id}}</td> <td>{{player.name}}</td> …
3
ngModel。$ modelValue和ngModel。$ viewValue有什么区别
我有以下ckEditor指令。在下面的示例中，我看到了两个有关如何在编辑器中设置数据的示例的两个变体： app.directive('ckEditor', [function () { return { require: '?ngModel', link: function ($scope, elm, attr, ngModel) { var ck = null; var config = attr.editorSize; if (config == 'wide') { ck = CKEDITOR.replace(elm[0], { customConfig: 'config-wide.js' }); } else { ck = CKEDITOR.replace(elm[0], { customConfig: 'config-narrow.js' }); } function updateModel() { …
94 angularjs 
8
AngularJS：有什么方法可以确定哪些字段使表单无效？
我在AngularJS应用程序的控制器内部有以下代码，该代码是从ng-submit函数调用的，该函数属于具名的表单profileForm： $scope.updateProfile = function() { if($scope.profileForm.$invalid) { //error handling.. } //etc. }; 在此函数的内部，是否有任何方法可以找出导致整个表单无效的字段？
3
如何刷新/使AngularJS中的$ resource缓存无效
我有一个简单的User $ resource，它使用默认的$ http缓存实现，如下所示： factory('User', function($resource){ return $resource(endpoint + '/user/current/:projectId', {}, {get: { cache: true, method: 'GET' } } ); }) 这很好用，即我的服务器在我的应用程序中仅被调用一次，然后从缓存中获取值。 但是我需要在执行某些操作后从服务器刷新值。有没有简单的方法可以做到这一点？ 谢谢。
2
在AngularJS中的ng-repeat循环内绑定ng-model
我正在尝试处理ng-repeat循环内的范围问题-我浏览了很多问题，但还无法使我的代码正常工作。 控制器代码： function Ctrl($scope) { $scope.lines = [{text: 'res1'}, {text:'res2'}]; } 视图： <div ng-app> <div ng-controller="Ctrl"> <div ng-repeat="line in lines"> <div class="preview">{{text}}{{$index}}</div> </div> <div ng-repeat="line in lines"> <-- typing here should auto update it's preview above --> <input value="{{line.text}}" ng-model="text{{$index}}"/> <!-- many other fields here that will also affect the …
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.