Почему возникает ошибка про рендере шаблона Vue?

Question

[Artem89]

<table class="table table-bordered tablesorter" id="packsTable">
		  <thead>
		    <tr class="table-head">
          <th scope="col">Id</th>
		      <th scope="col">Courier</th>
		      <th scope="col">Track</th>
		    </tr>
		  </thead>
		  <tbody id="packs-table">
		  	<tr class='table-content' v-for="pack in packs">
            <td>{{pack.id}}</td>
	          <td>{{pack.courier}}</td>
            <td v-if="(pack.courier == 'Fedex')">
					        <a :href="'http://www.fedex.com/Tracking?sum=n&ascend_header=1&clienttype=dotcom&spnlk=spnl0&initial=n&cntry_code=us&tracknumber_list=' +pack.track_number + '&language=english&track_number_0=' + pack.track_number + '&track_number_replace_0=' + pack.track_number" target='_blank'>{{pack.track_number}}</a>
				    </td>
				    <td v-else-if="(pack.courier == 'UPS')">
					        <a :href="'http://wwwapps.ups.com/etracking/tracking.cgi?TypeOfInquiryNumber=T&InquiryNumber1=' + pack.track_number + '&commit=Track%21" target='_blank'>pack.track_number</a>
				    </td>
				    <td v-else>{{pack.track_number}}</td>		
		  	</tr>

		  </tbody>
		</table>

Полный код:
https://codepen.io/anon/pen/GGPmZO

При использовании :href возникает ошибка, а мне нужно использовать :href для генерации ссылок. Если не биндить а использовать href хардкодом, то все в порядке. Как сгенерировать ссылки?

Ошибка:

vue.js:597 [Vue warn]: Failed to generate render function:

SyntaxError: Unexpected identifier in

(found in )

Answer 1

[Андрей Хохлов]

<a :href="'http://wwwapps.ups.com/etracking/tracking.cgi?TypeOfInquiryNumber=T&InquiryNumber1=' + pack.track_number + '&commit=Track%21"

Кавычка в конце?

Comments

[Artem89]

Спасибо!

Answer 2

[Evgeny Kulakov]

Вот здесь:

href="'http://wwwapps.ups.com/etracking/tracking.cgi?TypeOfInquiryNumber=T&InquiryNumber1=' + pack.track_number + '&commit=Track%21"

1. href => :href
2. в конце + '&commit=Track%21" => + '&commit=Track%21'"

Comments

[Artem89]

Спасибо!