2013-02-08 3 views
17

현재 웹 응용 프로그램 개발을 위해 Ember.js를 사용하는 방법을 배우기 시작했습니다. 현재 내가 아직 성취 할 수 없었던 아주 기본적인 것이 있습니다. www.google.com 등의 외부 URL에 링크하십시오. 이것은 내가 무엇을 가지고 :HandelBars를 사용하여 LinkTo로 외부 URL에 연결하는 방법

HTML을

<body> 
    <script type="text/x-handlebars"> 
    <div> 
     Hello, <strong>{{firstName}} {{lastName}}</strong>! 
    </div> 

     {{#linkTo google}}Google{{/linkTo}} 

    </script> 
</body> 





$(document).ready(function() { 



//alert("HELLO WORLD"); 
window.App = Ember.Application.create(); 

App.ApplicationController = Ember.Controller.extend({ 
    firstName: "Trek", 
    lastName: "Glowacki", 
    googleURL: "www.google.com/ncr" 
}); 

App.Router.map(function() { 
    this.route("google", { 
     path: "www.google.com" 
    }); 

}); 

});

링크가 렌더링이 작업을 수행하지만이 주소로 이동 : E : /EMBERJS/index.html#/www.google.com

어떤 힌트를 주시면 감사하겠습니다. 나는 이것을 스스로 알아 내지 못했지만 조금 밖에 도움이되지 않는다고 믿을 수 없다.

감사합니다, 당신은이에 대한 linkTo 도우미를 사용하지 않으려는

+1

왜'linkTo' 템플릿이 필요한 특별한 이유가 있습니까? 왜 순수한 HTML에서 앵커 태그를 사용하지 않는 것이 좋을까요? – Deif

답변

35

황소. linkTo 도우미는 Ember.JS 응용 프로그램 내의 다른 상태로 전환하는 데 사용되지만 사용자가 응용 프로그램에서 멀리 이동하려고 시도하는 동안 사용됩니다.

당신이 사용할 수있는 두 가지 방법이 있습니다

  1. 이것은 당신의 targetUrl 앵커에 결합하지만, URL이 변경 될 경우는 업데이트되지 않습니다.

    <a target="_blank" href="{{unbound view.targetUrl}}">Google</a>

  2. 다음 방법은 앵커에 결합하는 것입니다, 당신은 개체에 targetUrl 속성을 업데이트 할 경우 그에 따라 그 닻을 업데이트합니다 :

    <a target="_blank" {{bindAttr href="view.targetUrl"}}>Google</a> 여기

는의를 JSFiddle for you : http://jsfiddle.net/zscff/

+1

JSFiddle을 업데이트하여 '언 바운드'의 차이점을 이해할 수 있습니다. http : // jsfiddle.net/zscff/1/2.5 초 후에'targetUrl' 속성을 변경하면 두 번째 예제가 예상대로 업데이트되지만 첫 번째 예제는 업데이트되지 않습니다. 둘 다 동일한 속성을 사용하지만 첫 번째 속성을 '언 바운드'로 지정했기 때문에 Ember는 DOM에서이를 업데이트하는 방법을 알지 못합니다. – Wildhoney

+0

감사합니다. 감사합니다. – Oxnigarth

+1

bindAttr은 이제 bind-attr을 사용하여 더 이상 사용되지 않습니다. –

0

당신의 말대로 사용하지 않아도 링크 - 도우미로 연결해야합니다. 간단한 앵커 태그 <a> </a> 만 사용하면됩니다.

방금 ​​같은 문제가있었습니다. 이 문제를 해결하려면 앵커 태그에주의해야합니다.
예. 이 <a href='www.example.com'> example </a> 같은 링크를 입력하면, 엠버 다음 링크
localhost를 생성합니다 : 4200/www.example.com

을하지만 당신은 HTTP를 추가하면, 모든 것이 괜찮 속성 HREF 할 수 있습니다.
<a href='http://www.example.com'> example </a>.
출력은 www.example.com

희망이 있습니다.

관련 문제