current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise
up vote 1 down vote favorite

Probably it's a dumb question but I can't really get out of it. In a AngularJS webapp I've splitted with a filter a String got from a JSON I can't modify: now the whole string (date+hour) is divided into an array made of 2 elements(array[0]=date, array[1]=hour), but I don't know how to get only the first one in the HTML.

I can't pass the single element as a scope and I can't use the ng-repeat because I have to assign different class to every element.

HTML:

<span class="time">{{manif.avvenimento.data | split:' '}}</span>

Result printed in HTML:

["03/02/2014","20:40"]

I need to get something like this:

<span class="A">03/02/2014</span>
<span class="B">20:40</span>

Thank you all!

share|improve this question
up vote 0 down vote accepted

Most probably this will do:

<span class="date">{{ (manif.avvenimento.data | split:' ')[0] }}</span>
<span class="time">{{ (manif.avvenimento.data | split:' ')[1] }}</span>
share|improve this answer
    
Thanks, it worked! :) I was trying to work with the ng-if="$index==0" and so on, but your solution is exactly what I needed. I couldn't hope it wuold work this way :) – peppeuz Feb 3 '14 at 15:31
up vote 2 down vote

I would place the two strings in a separate object. That way you won't be performing the string split on every digest cycle, which is better for performance.

In your controller:

$scope.timestamp = {
    'date': '',
    'time': ''
}

$scope.$watch(manif.avvenimento.data, function (newValue, oldValue) {
    $scope.timestamp.date = ... // Place the date here
    $scope.timestamp.time = ... // Place the time here
});

In your HTML:

<span class="time">{{timetamp.time}}</span>
<span class="date">{{timetamp.date}}</span>
share|improve this answer
    
As I said, I can't modify the string using the scope, because it was part of a bigger scope made of element I need to repeat. – peppeuz Feb 3 '14 at 15:32
    
@peppeuz: Can't you change the scope at all? The downside with the chosen answer is that the split is performed twice each time the scope is dirty checked, which happens very often in Angular. This can slow the application down, especially if you combine it with ng-repeat. My answer didn't answer your specific question, but keep it in mind if your application ever starts to run slow. More info about digest and performance: stackoverflow.com/a/9693933/179024 – MW. Feb 3 '14 at 22:11
up vote 0 down vote

To get the JSON array from your back-end, add the following to your AngularJS controller:

var dtRes = $resource('URL to your resource object');
$scope.dtArr = dtRes.query();

Then iterate through it in your HTML using:

<li data-ng-repeat="dt in dtArr">
    <span>{{dt.date}} {{dt.time}}</span>
</li>
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.