루트에 상대적인 지시어 templateUrl 지정

루트에 상대적인 지시어 templateUrl 지정

---

현재 현재 창 위치를 기준으로 templateUrl을 지정하고 있습니다.

cvApp.directive('personalDetails', function () {

    return {
        restrict: 'A',
        templateUrl: '../../Scripts/app/templates/personalDetails.html'
    };

});

애플리케이션의 루트를 기준으로 templateUrl을 어떻게 만들 수 있습니까? 나는 다음과 같은 것을 찾고 있습니다.

templateUrl: '~/Scripts/app/templates/personalDetails.html'

AngularJS가 이것을 수행 할 수 있습니까?

---

지원되는 것 같습니다. AngularJS Google 그룹 의 스레드에서 가져 왔습니다 .

"/"접두사가있는 url은 도메인에 상대적이며 "/"접두사가 없으면 기본 ( "index.html") 페이지 또는 기본 URL (html5 모드에서 위치를 사용하는 경우)에 상대적입니다.

이것은 잘 작동합니다.

templateUrl: '/Scripts/app/templates/personalDetails.html'

---

ASP.NET 스타일 앱 상대 경로를 수행하려고하지만 클라이언트 쪽을 시도하는 것 같습니다. 수정은 실제로 HTML에 있습니다. 다음과 같이 헤드에 기본 태그를 추가합니다.

<base href="<%= Request.ApplicationPath %>" />

그런 다음 다음과 같이 템플릿 경로를 이에 상대적으로 유지하십시오.

templateUrl: 'Scripts/app/templates/personalDetails.html'

---

'././Scripts/app/templates/personalDetails.html'사용

그것은 나를 위해 일했습니다.

---

angular 4는 webpack을 번 들러로 사용합니다.

./ means relative path to current folder



../ means parent folder

도메인 = src

루트 = src / index

예를 들어 app.component.ts 파일 아래에서 url은 xxx.html xxx.css가 xxx.ts와 동일한 폴더에 있음을 의미합니다.

./ is relative path as current folder

../ is relative path as parent folder

@Component({
 selector: 'app-root',
 templateUrl: './app.component.html',
 styleUrls: ['./app.component.css']
})

각국의 구성 요소 상대 경로

참고 URL : https://stackoverflow.com/questions/16887018/stating-directive-templateurl-relative-to-root