angularjs - ng-show not working with ng-repeat -
i have variable set true in ng-click div underneath not displaying. i've followed this post looks doesnt work in maybe ng-repeat? here's plunker: http://plnkr.co/edit/90g1kax9fmf2sgrs5gyk?p=preview
angular.module('myappapp', []) .controller('mainctrl', function ($scope) { $scope.notes = [{ id: 1, label: 'first note', done: false, somerandom: 31431 }, { id: 2, label: 'second note', done: false }, { id: 3, label: 'finished third note', done: true }]; $scope.reach= function (id) { //the assignment below works //$scope.flag = true; alert("hello there"); }; }); <div ng-app="myappapp"> <div ng-controller="mainctrl"> <div ng-repeat="note in notes"> {{note.id}} - {{note.label}} - <a href="#" ng-click="flag = true;reach(111);">click me</a> </div> <div class="row" id="" ng-show="flag">i'm here</div> </div> </div>
i advise use ng-init
<div ng-repeat="note in notes" ng-init="parent=$parent">
and after that
<a href="#" ng-click="parent.flag = true;reach(111);">click me</a>
please see demo below
angular.module('myappapp', []) .controller('mainctrl', function($scope) { $scope.notes = [{ id: 1, label: 'first note', done: false, somerandom: 31431 }, { id: 2, label: 'second note', done: false }, { id: 3, label: 'finished third note', done: true }]; $scope.reach = function(id) { //$scope.flag = true; alert("hello there"); }; });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body> <div ng-app="myappapp"> <div ng-controller="mainctrl"> <div ng-repeat="note in notes" ng-init="parent=$parent"> {{note.id}} - {{note.label}} - <a href="#" ng-click="parent.flag = true;reach(111);">click me</a> </div> <div class="row" id="" ng-show="flag">i'm here</div> </div> </div> </body>
Comments
Post a Comment