각도 js 지시문을 동적으로로드하고 싶습니다.
3 가지 지시문이 있다고 생각해
<apple data="data"/>
apple.html은 apple 용 UI를 제공합니다.
<banana data="data"/>
banana.html은 banana 용 UI를 제공합니다.
<mango data="data"/>
mango.html은 mango 지시문에 대한 UI를 제공합니다.
JSON 데이터를 기반으로이 지시문 중 하나를로드하고 싶습니다.
데이터 : {과일 유형 : "사과": fruitObj : { "..."}}
에 UI 층
실제로 과일 각도 태그 ( <apple>, <banana>또는 <mango>)를 보유 할 JSP가 있습니다 .
내 질문은 JSP 로직에 무엇을 작성해야 하는가?
일반적으로 정적 jsp를 사용하여 다음과 같이 작성합니다.
<div ng-app="fruitApp">
<apple></apple>
</div>
디렉티브 범위에서 함수를 정의하여 templateUrl을 가져오고 아래와 같이 디렉티브 템플릿에 템플릿을 포함 할 수 있습니다.
app.directive("fruit", function() {
return {
scope: {
data: '=data',
fruitType: '@type'
},
link: function(scope, element, attrs) {
scope.getTemplate = function() {
//path to yours templetes
return scope.fruitType + '.html';
}
},
template: '<div ng-include="getTemplate()"></div>',
}
})
전체 작업 데모는 여기에서 찾을 수 있습니다. http://plnkr.co/edit/VC6NfnYpcKFyhwgOot38?p=preview
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다