How to Access a ngInit Value from ngRepeat in Scope

Question

In my infoDisplay(member) I need to access the ng-init value specific to the div that I clicked on from the $scope and manipulate the value. How do I do so?

<div ng-repeat="member in memberData">
    <div class="card" ng-init="cardClicked = 'false'">
        <div ng-click="infoDisplay(member)">
        </div>
    </div>
</div>

The Javascript:

$scope.infoDisplay = function (member) {
    if (settings.useApiInfo == 'false') {
        var url = settings.directoryUrl + member.Id;
        var openUrl = cordova.InAppBrowser.open(url, '_system', 'location = yes');
    }
    else {
        cardClicked = { 'true': 'false', 'false': 'true' }[cardClicked];
    }
}

The first part works, it is to open a url in my mobile app. I just need the second part but can't get it working.

Just pass cardClicked in as well: `infoDisplay(memeber, cardClicked)`? — opticon, Mar 17 '17 at 15:22
@opticon That would only access cardClicked in your function and wouldn't affect the scope variable. — Thomas Juranek, Mar 17 '17 at 15:36

score 4 · Accepted Answer · answered Mar 17 '17 at 15:23

What I would do is set the flag on the item itself:

<div ng-repeat="member in memberData">
    <div class="card" ng-init="member.cardClicked = false">
        <div ng-click="infoDisplay(member)">
        </div>
    </div>
</div>

Then you can acces it in your controller:

$scope.infoDisplay = function(member) {
    var cardClicked = member.cardClicked;
}

If you think that your cardClicked shouldn't be on your member item, just track the values in an array:

<div ng-repeat="member in memberData">
    <div class="card" ng-init="cardsClicked[$index] = false">
        <div ng-click="infoDisplay(member, $index)">
        </div>
    </div>
</div>

Then you can acces it in your controller:

$scope.infoDisplay = function(member, index) {
    var cardClicked = $scope.cardsClicked[index];
}

How to Access a ngInit Value from ngRepeat in Scope

1 Answers1