Tag: angularjs ng repeat

当使用$ index跟踪时，ng-init没有第二次调用

HTML： {{employeeName}} 控制器： $scope.initUserDecision = function(row,index){ $scope.employeeName=row[“name”]; } $scope.rows=[{id:1,name:’siva’},{id:2,name:’ram’}] //changing $scope.rows in button click event and used $scope.$apply as well angular.element(document).on(“click”, “#change”, function () { $scope.rows=[{id:1,name:’ravi’},{id:2,name:’raj’}] $scope.$apply(); }); ng-init函数在tr初始化时首次调用。 如果我点击更改按钮行集合被更改，它将不会再次调用ng-init 。 如果我通过$index ng-init删除跟踪调用时间。 当我通过$index使用track时，它只被调用了一次。 为什么会这样？ 对此有任何想法。

AngularJS指令与ng-repeat – misbehavior共享范围

我遇到了一个奇怪的情况。 我需要有两个可排序的列表，它们应该通过拖放或添加/删除事件来交换元素。 我创建了一个运行良好的指令。 控制器事件也能做正确的工作。 当组合方法时，问题就开始了（按钮添加+拖放+按钮再次添加按钮）。 KA-BOOM！ 我把这个plnkr放在一起： http ：//plnkr.co/edit/DumufP1kDdkz1INAXwmF？p = preview 单击元素，然后单击按钮操作（添加/删除）。 让我分享一些指令的代码只是为了好玩，但请访问链接以查看整个实现。 有关如何在plnkr中重现该问题的更多信息 .directive(‘sortableList’, function ($log) { return { restrict: ‘A’, scope: { fromList: ‘=’, toList: ‘=’ }, link: function (scope, elm, attrs) { var callback = { receive: function (event, ui) { //– Get the scope of the list-item var scopeItem = ui.item.scope(); […]

当我从Angularjs中的响应绑定数据时，Bootstrap multiselect不起作用

当我从Angularjs中的响应绑定数据时，Bootstrap multiselect不起作用 angular.module(‘ngvalueSelect’, []) .controller(‘ExampleController’, [‘$scope’,’$http’, function($scope,$http) { $http.get(‘https://reqres.in/api/unknown’) .then(function (result) { console.log(result.data); $scope.exampleData = result.data; $scope.data = result.data; }) $scope.data = { availableOptions: [ {value: ‘001’, name: ‘Hello’}, {value: ‘002’, name: ‘integer’}, ] }; console.log( $scope.data ); }]); ngvalue select: {{option.value}}-{{option.name}} model = {{data.model | json}} ngvalue select: {{option.name}} model = {{data.model | json}} […]

引导转盘Ng重复四项？

我试图在幻灯片中显示四个项目。 但是我如何重复主行，因为它使用活动类的活动类。 这就是我的HTML看起来的样子。 以及JSON的一个例子。 $scope.images = [ “http://placehold.it/500/e499e4/fff&text=1”, “http://placehold.it/500/e499e4/fff&text=2”, “http://placehold.it/500/e499e4/fff&text=3”, “http://placehold.it/500/e499e4/fff&text=4”, “http://placehold.it/500/e499e4/fff&text=5”, “http://placehold.it/500/e499e4/fff&text=6”, “http://placehold.it/500/e499e4/fff&text=7”, ]

Grid-A-Licious Grid中的ng-repeat

我正在使用Grid-A-Licious插件（ http://suprb.com/apps/gridalicious/ ）。 我的标记如下： Properties Around you {{m.title}} Bath : 2 Beds : 2 Pool : 2 $380,000 See Detail Compare 正如你在网格中看到的那样，我有一个绑定到我的视图模型的ng-repeat属性。 我遇到的问题是，Grid-A-Licious需要在document.ready（）上运行以下代码： $(“.grid-item”).gridalicious({ width: 250, gutter: 10, animate: true, effect: ‘fadeInOnAppear’ }); $(“.grid-galeries”).gridalicious({ width: 240, gutter: 10, animate: true, effect: ‘fadeInOnAppear’ }); 我遇到的问题是我的网格内容绑定到我的视图模型，并将根据其他条件动态更改（它实际上是服务调用的结果）。 这导致网格外观错误。 有什么办法，我可以调用上面的选择器，每次grid属性绑定的模型属性都会发生变化吗？ 这样做是否完全违背angularJS惯例？ 提前谢谢了

ng-repeat动态完成后的Angular JS回调

有大量post显示如何根据指令设置回调函数，这样当ng-repeat函数完成后，您可以等待然后调用函数。 例如，这是我的例子。 {{Object.Overlay} 然后当它完成时，以下调用我的函数 .directive(‘onFinishRender’, function ($timeout) { return { restrict: ‘A’, link: function (scope, element, attr) { if (scope.$last === true) { $timeout(function () { scope.$emit(‘ngRepeatFinished’); }, 0); } } } }); 完成后，这会成功调用我的函数 $scope.$on(‘ngRepeatFinished’, function(ngRepeatFinishedEvent) { //my code goes here } 现在所有这些都完美无缺，并且第一次设置我的$ scope.Objects变量时也是如此。 我的代码将等待所有对象完全呈现然后运行，完全是完美的。 但是，如果在最初的所有内容后我再次更改$ scope.Objects，我的函数仍会运行，但它不会等待完成。 它实际上可以通过控制台日志看到，第一次循环它会在我进入指令之后但在实际发射之前暂停大约半秒，但是在我的ng-repeat的后续更改中它不会暂停并简单地调用我的函数之前dom完成渲染。 这太烦人了，任何帮助都会很棒！

ng-repeat排序在jQuery中引发exception

我有一个由ng-repeat创建的行的表。 表头具有ng-click，用于设置排序的谓词（该函数还确定方向，asc / desc）。 排序工作正常，但由于某种原因，每次我更改谓词和排序时，我都会从jQuery中获得exception。 这是我正在做的一个更好的例子： http ：//plnkr.co/edit/qfNcm9RPQSsNgqmm3TYS？p = preview 正如您在plnkr中看到的那样，ng-repeat非常简单。 我们项目中的ng-repeat是相似的，而不是更复杂。 这实际上发生在我们代码中的许多地方，我们在它们之间使用不同的排序方法，但它们仍然受到影响。 可以单击表标题以对项目进行排序。 那个plunkr没有出现问题。 即使排序在我的页面上工作，它也会打破页面上的其他内容（就像一个光滑的轮播控件）。 例外是在jquery.js的第1430行（通过包括Sizzle.js的谷歌CDN的版本2.1.1）。 发生exception的方法是Sizzle.attr。 它看起来像是在循环遍历使用ng-repeat创建的所有元素，并从中获取属性值。 当它到达“结束ngRepeat：AllContests | orderBy：sort：ReverseSort中的竞赛”注释时，会发生exception，表示ng-repeat部分的结束。 具体来说，当我尝试在元素上使用getAttribute（）时，我得到’Uncaught TypeError：undefined不是函数’。 return val !== undefined ? val : support.attributes || !documentIsHTML ? elem.getAttribute( name ) : (val = elem.getAttributeNode(name)) && val.specified ? val.value : null; 现在，我可以拉jquery，将它添加到我的项目编辑它，以便它评估elem.nodeName ==“#comment”，并在这种情况下返回null。 我更愿意知道我做错了什么，或者是否有更好的方法。 否则，是否有一种方法可以覆盖该方法并在不编辑jquery库的情况下提供我自己的方法？ 编辑 以下是操作中的问题示例： https […]

如果从不同的表单调用按钮，为什么Ng Repeat不起作用？

我有一个包含ng repeat指令和两个按钮的html表。第一个将打开一个包含新表单的模式，让我创建我的用户，然后当我点击保存时，它会将它添加到列表中。第二个是相同的原始forms，并添加用户。 我不明白为什么当我点击不同forms的第一个按钮时，我无法更新ng重复，但是对于第二个按钮，它是可能的。 这是代码： homepage.jsp Create ID. Name Address Email user_controller.js ‘use strict’; App.controller(‘UserController’, function ($scope, UserService, $window, $log, $uibModalStack, $uibModal, $rootScope) { var self = this; self.users = []; self.fetchAllUsers = function () { console.log(‘———-Start Printing users———-‘); for (var i = 0; i < self.users.length; i++) { console.log('FirstName ' + self.users[i].firstName); } }; /** […]

ng-repeat中的Fancybox指令不是对图像进行分组

我试图在我的应用程序中使用Fancybox ，当插件工作时（它打开灯箱中的图像），它没有识别rel或data-fancybox-group属性来分组多个图像（这样我就可以正确浏览它们了在灯箱里）。 这是我的指示： app.directive(‘fancybox’, function() { return { restrict: ‘A’, link: function(scope, element) { $(element).fancybox({ theme : ‘dark’ }); } }; }); 以下是我在模板上调用它的方法： 我试图在指令本身设置rel / data-fancybox-group属性，但结果是相同的，它添加了attribtute，但Fancybox不能将图像识别为同一组的一部分。 任何帮助表示赞赏，谢谢！

没有父/子比较器的递归AngularJS Ng-Repeat

我需要为我的文件结构创建一个递归ng-repeat。 我在互联网上发现的一切都是使用父母/子女比较器。 像这样： $scope.categories = [ { title: ‘Computers’, categories: [ { title: ‘Laptops’, categories: [ { title: ‘Ultrabooks’ }, { title: ‘Macbooks’ } ]}, // ……continued….. 但是，我的数据存储在firebase中，就像这个JSFIDDLE， https： //jsfiddle.net/mdp4dfro/6/中显示的那样。 （我不会花时间格式化所有这些，所以StackOverflow很高兴….） 现在，这就是我的ng-repeat。 如果我想添加另一个分支，我必须创建另一个分支。 我只想让它自动发生。 {{foKey}} {{object.Name}} {{obKey}} {{folder.Name}} 我如何使这个代码递归，所以它包括每个级别，无论多少。 这是我得到的最好的评论，发布的地方，我很难得到帮助，可能需要SPOON FED。 抱怨它。 projectRef.child(‘code’).once(‘value’, function(snapshot){ var tree = []; angular.forEach(snapshot.val(), function(object, key){ if(object.Key) { console.log(object.Key); } […]