1

The Error being thrown

=> Errors prevented startup:                  

   While processing files with angular-templates (for target web.browser):
   client/templates/rcalendar/day.html:7: Expected tag name after `<`
   ...            {{$index<12?($index === 0?12:...
   ^
   client/templates/rcalendar/week.html:16: Expected tag name after `<`
   ...            {{$index<12?($index === 0?12:...

The offending HTML

<td class="calendar-cell">
   <div class="add_event_shade" style="height:100%;" ng-if="!tm.events" ng-show"clickCount" on-touch="hourTouch($event)">
      <p style="display:none;">+ New event</p>
      <p style="display:none;">{{$index<12?($index === 0?12:$index)+':00 am':($index === 12?$index:$index-12)+':00 pm'}}</p>
   </div>
   <div ng-class="{'calendar-event-wrap': tm.events}" ng-show="tm.events">
      <div ng-repeat="displayEvent in tm.events" 
             class="calendar-event" 
             ng-click="eventSelected({event:displayEvent.event})"
             ng-style="{left: 100/displayEvent.overlapNumber*displayEvent.position+'%', width: 100/displayEvent.overlapNumber+'%', top: displayEvent.event.startTimeOffset+'%', height: 37*(displayEvent.event.totalApptTime)+'px'}">
          <div class="calendar-event-inner" style="white-space: pre-wrap; font-weight: bold">{{displayEvent.event.title}}</div>
      </div>
   </div>
</td>

How can I set conditionals in my bindings like this?

Brad W
  • 2,540
  • 2
  • 18
  • 28
  • Did you get a chance to look at this link http://stackoverflow.com/questions/19264586/escaping-characters-in-ng-bind-in-angularjs – Surabhi May 09 '16 at 20:11
  • unrelated, but shouldn't you put that inside a filter instead of directly in the template? Not very readable like this... – Pevara May 10 '16 at 15:12
  • @Pevara probably cleaner. It's a lib that I installed in my ionic application. It wasn't throwing errors until I tried to move the ionic application inside the client directory of a Meteor app to use for my backend. – Brad W May 10 '16 at 15:17

1 Answers1

0

I think you have to do something like this :

<p style="display:none;">
    {{($index < 12 && $index === 0)? 12 : $index}}:00 am
    {{$index === 12? $index : ($index - 12)}}:00 pm
</p>

But be careful, you put a display:none in the p tag.


Edit: As discussed in the comments, to avoid the error given by angular-template we can call a function from the controller instead of evaluating the expression in the p tag

<p>{{getTime($index)}}</p>
  • The problem isn't how it's displaying. [angular-templates](https://atmospherejs.com/meteor/angular-templates) thinks the less than symbol is an opening HTML tag bracket without a closing one. I already tried adding space between `$index` the less than symbol and `12`. It throws the same error. – Brad W May 10 '16 at 14:50
  • 1
    Alright I see the problem now. Instead of evaluating an expression in the `p` tag, you could call a function from your controller like this : `

    {{getTime($index)}}

    ` ? (And you can do the logic in the `getTime()` function)
    – Stéphane Eintrazi May 10 '16 at 15:12
  • Thanks @JeanMel. I had considered that. As I just mentioned to @Pevara above, I was just wondering if there was a way to format the less than symbol so that `angular-templates` wouldn't think it was a opening HTML bracket. If that isn't possible then moving it to the controller is probably the route I will go. – Brad W May 10 '16 at 15:21