Aurelia의 {wrap} 부트 스트랩 navbar가 제대로 작동하지 않습니다.

Question

내 문제를 확인 했으므로 해결 방법을 찾지 못했습니다. 나는 아무도 그래픽 디자이너가 아니기 때문에 {wrap} 부트 스트랩에서 테마를 얻었고 Navigation 뼈대를 기반으로 Aurelia에서 함께 결합하기 시작했습니다.

내 문제는 navbar입니다. 잘, 아무 문제 - - 골격 사용하여 경로는 app.js에 구성되지 않고 다음 사람은 하나의 페이지에 네비게이션 바에을 꺼낼

<require from="nav-bar.html"></require> 

사용합니다. F12에서 나에게 알리는 것처럼 내 보내진 HTML에서 새 요소가 탐색 막대 구성 요소의 컨테이너로 추가되므로 CSS가 변형됩니다. 이 경우

<nav-bar class="au-target" router.bind="router" au-target-id="1"> 
<!-- usual bootstrap navbar stuff --> 
</nav-bar> 

어떻게 해결할 수 있습니까? 아우렐 리아의 @containerless 데코레이터를 사용

Answer 1

:

당신이 아우렐 리아의 @containerless 장식을 사용하고 싶을 것이다이를 위해. 내가 아는 한 HTML보기가 아닌 전체 구성 요소가 있어야합니다. nav-bar.js도 아직없는 경우에는 만들 필요가 없습니다.

예 항법 bar.js :

import {containerless} from 'aurelia-framework'; 

@containerless 
export class NavBar { 
} 

사용법 :

먼저, 다음과 같이 부모보기에서보기 nav-bar을 필요로한다. 당신이 또한 뷰 모델을 찾기 위해 원하기 때문에 하지이 .html를 지정해야합니다 : 다음

<require from="nav-bar"></require> 

, 더 아래 올바른 위치에보기에, 그것을 포함하는 요소 태그를 사용합니다. Compose 요소를 사용하여

<nav-bar></nav-bar> 

대체 접근 방식은 :

나는이를 사용한 적이 있지만, 그것은 또한 좋은 방법이 될 수 있습니다. Dwayne Charrington의 this blog article에 따르면 내장 된 Aurelia 요소 <compose>을 사용하여 containerless보기 및/또는 viewmodel없이보기를 가져올 수도 있습니다. 그것은 당신이 둘 다 할 수 있다고 명시 적으로 말하지 않기 때문에 나는 그것이 작동 할 것이라는 가정을하고 있습니다. 이 답변 게시를 업데이트해야하는 경우 알려주세요.

<compose view="nav-bar.html" containerless></compose>