각도 UI 라우터 중첩 보기
-
21-12-2019 - |
문제
UI 라우터를 사용하여 일반 보기에 중첩된 보기를 삽입하려고 합니다.ng-include를 수행하면 가능하다는 것을 알고 있습니다.하지만 ui-router를 사용하여 해결하고 싶습니다.
내 HTML은 다음과 같습니다
<div class="row">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-heading">Project todos</div>
<div class="panel-body">
<div ui-view="todos"></div>
</div>
</div>
</div>
</div>
그런 다음 내 스크립트에 상태가 표시됩니다.
.state('project', {
url: '/project/:projectId',
templateUrl: 'views/project/project.html',
controller: 'ProjectCtrl',
views: {
'todos': {
templateUrl: 'views/project/todos.html'
}
}
})
업데이트 - 이런 게 가능하지 않나요?
.state('project', {
url: '/project/:projectId',
templateUrl: 'views/project/project.html',
controller: 'ProjectCtrl',
views: {
'todos@project': {
templateUrl: 'views/project/todos.html'
}
}
})
누구든지 오타나 뭔가를 찾을 수 있나요?나는 문서를 읽었습니다.무엇이 잘못되었는지 잘 모르겠습니다.
미리 감사드립니다!
해결책
작업이 있습니다 플런저, 이를 실행하는 방법을 보여줍니다.
index.htm에서 우리는 <div ui-view="" ></div>
, project.html을 삽입한 곳입니다.그런 다음 상태 정의를 조정하여 중첩된 뷰도 삽입합니다. ui-view
절대 이름:
.state('project', {
url: '/project/:projectId',
views: {
'' : {
templateUrl: 'views.project.project.html',
controller: 'ProjectCtrl',
},
'todos@project': {
templateUrl: 'views.project.todos.html'
}
}
});
절대적인 이름 todos@project
, todos.html을 project.html에 삽입합니다.을 체크 해봐 플런저
다음을 참조하세요:
인용:
...뒤에서 모든 뷰에는 다음 구성표를 따르는 절대 이름이 할당됩니다.
viewname@statename
, 여기서 viewname은 view 지시어에 사용된 이름이고 state name은 상태의 절대 이름입니다.연락처.항목절대 구문으로 뷰 이름을 작성하도록 선택할 수도 있습니다.
제휴하지 않습니다 StackOverflow