angular 에서 ui calendar 의 사용 소감(추천)
공식 주소:http://angular-ui.github.io/ui-calendar/
fullcalendar 와 ui calendar 패키지 설치 에 대해 서 는 소개 하지 않 겠 습 니 다.자전거
패키지 설치 후 경로 참조 추가
이번 개발 환경 angular1.x
호출
<div ui-calendar="uiConfig.calendar" class="span8 calendar" ng-model="eventSources" calendar="myCalendar"></div>
controller 에 인자 설정
/* config object */
$scope.uiConfig = {
calendar: {
height:..,//
editable:..,//
header: {
right: '',//
center: 'title',
left: '',//
},
}
};
$scope.eventSources = [$scope.events];
이것 은 기본 설정 입 니 다.다른 것 은 필요 에 따라 설정 하 십시오.다음은 내 가 사용 하 는 과정 에서 만난 몇 가지 문 제 를 이야기 하 자.먼저 수요 부터 시작 해 야 한다.
1.제품 수요:매일 이 벤트 는 필드"x"에 따라 정렬 해 야 합 니 다.
2.월 별로 다른 보기 데 이 터 를 확인 해 야 합 니 다.
먼저 첫 번 째 문 제 를 해결 하고 fullcalendar 에 정렬 기능 이 있 는 지 확인 합 니 다.중국어 바 이 두 는 반나절 동안 있 었 습 니 다.좋 습 니 다.포기 합 니 다.영어 로 검색 한 결과 새 버 전의 fullcalendar 에서 정렬 필드 를 제 공 했 습 니 다.기본 값 은'title'입 니 다.그래서 fullcalendar 를 다시 설치 하고 정렬 방법 을 수 동 으로 설정 합 니 다.데이터 에 사용자 정의 정렬 필드 를 추가 합 니 다.예 를 들 어{title:111',sort:22'},그리고$scope.urConfig.calendar 에 eventOrder:'sor'를 추가 하면 됩 니 다.기 쁩 니 다.첫 번 째 문제 가 해결 되 었 습 니 다!
두 번 째 문 제 는 시간 에 따라 월 별 보 기 를 보고 이벤트 소스 에 월 별 데이터 집합 을 던 지면 되 지 않 습 니까?해 봤 는데 어,보기 가 변 하지 않 아...또 영어 검색 여행 을 시 작 했 는데...
드디어 댓 글 을 찾 았 습 니 다.방법 은 다음 과 같 습 니 다.
1.contrller 에 uiCalendarConfig 를 주입 한 다음 uiCalendarConfig.calendars.my Calendar.fullCalendar('gotoDate',calendarMonth);calendarMonth 는 디 스 플레이 를 불 러 올 달 이지 만 호출 후 uiCalendarConfig.calendars.my Calendar is undefined...
해결 방법:
$timeout(function(){
uiCalendarConfig.calendars.myCalendar.fullCalendar('gotoDate', calendarMonth);
});
이 단계 에 이 르 러 프로젝트 가 요구 하 는 기본 기 는 이미 실현 되 었 다.시작 최적화:
1.화면 을 중국어 로 바 꾸 고 config 설정 에 lang:zh-cn 또는 locale:zh-cn 을 추가 합 니 다.아직 안 되면 ui calendar 패 키 지 를 업그레이드 하 십시오.
2.보기 로드 가 느 리 고 영어 로 오랫동안 검색 되 었 습 니 다...토로 하 다.중국인 들 은 이런 문제 에 부 딪 힌 적 이 없 습 니까?중국어 검색 은 전혀 찾 을 수 없습니다.마지막 으로 댓 글 을 봤 습 니 다.
$scope.eventSource=[$scope.events];$scope.eventSource=[]로 변경,
$scope.events 는 요청 을 통 해 수신 후 uiCalendarConfig.calendars.my Calendar.fullCalendar('addEventSource',$scope.events)를 되 돌려 줍 니 다.불 러 와 서 해 봤 어 요.nice,느 린 문제 해결...그러나 새로운 문제 가 왔 습 니 다.보 기 는 지난번 데 이 터 를 지우 지 않 고 중복 데 이 터 를 만 들 수 있 습 니 다!
마지막 으로$scope.eventSource.push($scope.events)로 바 뀌 었 습 니 다.문제 도 해 결 했 지만 위의 문 제 는 풀 리 지 않 았 다...고수 의 조언 을 환영 합 니 다!
이상 은 내 가 사용 하 는 과정 에서 만난 문제 들이다...같은 문제 에 부 딪 힌 분 들 에 게 도움 이 됐 으 면 좋 겠 습 니 다!나중에 쓸 수 있 도록 스스로 기록 해라!
이 angular 에서 ui calendar 의 일부 사용 소감(추천)은 바로 편집장 이 여러분 에 게 공유 한 모든 내용 입 니 다.여러분 에 게 참고 가 되 고 여러분 들 이 저 희 를 많이 사랑 해 주 셨 으 면 좋 겠 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Angular에서 타사 스크립트 및 CSS 작업Angular 방식으로 회로도가 있는 외부 라이브러리를 추가하거나 모듈을 가져옵니다. Angular.json은 Angular 프로젝트의 모든 설정 파일이며 표준 JavaScript 및 CSS 파일과 함께 타사 라이브...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.