0

Apologies for the poorly worded question, I am struggling with the logic of this one.

I have the following JSON array:

{

    "status": {
        "available": [
            { 
                "title": "Currently available for contracts" ,
                "dateAvailable": null,
                "company": null
            }
        ],
        "on-assignment": [
            { 
                "title": "Currently Unavailable" ,
                "dateAvailable": "2015-03-25",
                "company": "BBQ Digital"
            }
        ],
        "on-holiday": [
            { 
                "title": "Currently on holiday" ,
                "dateAvailable": null,
                "company": null
            }
        ]
    }
}

Coupled with the following controller: 

.controller('statusCtrl', function($scope, $http) {
        $scope.astatus = [];
        $http.get('app/model/status.json')
            .success( function(response) {
                $scope.astatus = response;
            })
            .error( function(err) {
                alert(err);
            });
    })

Using AngularJS (v1.3.14) I want to check a variable to see if I am 'available', 'on-assignment' or 'on-holiday' and to display the 'title', 'dateAvailable' and 'company' attributes of the correct status section. In a manner similar to this (excuse the pseudocode):

    <div class="cta">
        // display the correct title
        {{ status.[next level].title }}
        if (on-assignment) {
            <span>Currently working for:</span>
            {{ status.[next level].company}}
            <span>I will be available on:</span>
            {{ status.[next level].dateAvailable}}
        }
        <a href="#contact" class="button">Get in touch</a>
    </div>

I've included the pseudocode on the template to make what I"m after clear, however if possible, I'd prefer this logic to be in the controller.

I am a good JavaScript/jQuery developer, however my experience with JSON is limited to much simpler stuff and I'm a complete beginner at AngularJS so please bear that in mind in your answers.

Note: As I'm trying to learn, explaining your answers would be hugely helpful.

Alex Foxleigh
  • 1,784
  • 2
  • 21
  • 47
  • Are you looking to display every piece of information in the array just in different parts of the page? – Sam Marland Mar 13 '15 at 11:10
  • No I only want to display the information from the specific availability status section. – Alex Foxleigh Mar 13 '15 at 11:13
  • why do you need 3 different arrays for `status`? What is trigger for your filtering? Question is pretty vague – charlietfl Mar 13 '15 at 11:43
  • To be honest, I think I have been thinking about this incorrectly. I want to be able to set if I am available, on assignment or on holiday and display the correct data in accordance to that but using this method, I'd have to hard-code a variable. – Alex Foxleigh Mar 13 '15 at 11:45

1 Answers1

1

You can use an Angular JS filter here.

{{ filter_expression | yourArray : {status: 'on-assignment'} : true}}

This should only return things that are 'on-assignment'.

Sam Marland
  • 552
  • 3
  • 24
  • 1
    Yes. Look [here](http://stackoverflow.com/questions/14302267/how-to-use-a-filter-in-a-controller). The docs that I link above also describe how to use a filter in a controller. You use the same 3 arguments as above for the $filter function. – Sam Marland Mar 13 '15 at 11:53
  • Thanks to the discussions stemmed from this question, I've realised that I've been thinking about this problem the wrong way, however this has answered the question as I asked it. So thank you. – Alex Foxleigh Mar 13 '15 at 11:55
  • How are you going to think about it now @AlexWard? – Sam Marland Mar 13 '15 at 11:56
  • I have realised that I've been trying to get my head around using JSON in the same way that I'd try to get my head around code, thinking about it less as a database and more as a config file. What I plan to do now is create a 'config.json' file which I can set various things on my site globally and then use that to display different templates. So if config.status === 'available' then it will display the available template. – Alex Foxleigh Mar 13 '15 at 11:59