각도 경로와 각도 UI 라우터의 차이점은 무엇입니까?

큰 응용 프로그램에서 AngularJS 를 사용할 계획 입니다. 그래서 사용하기에 적합한 모듈을 찾는 과정에 있습니다.

ngRoute (angular-route.js) 와 ui-router (angular-ui-router.js) 모듈 의 차이점은 무엇입니까 ?

ngRoute 가 사용되는 많은 기사 에서 route는 $ routeProvider 로 구성됩니다 . 그러나 ui-router 와 함께 사용 하면 route는 $ stateProvider 및 $ urlRouterProvider로 구성됩니다 .

더 나은 관리 효율성과 확장 성을 위해 어떤 모듈을 사용해야합니까?

ui-router 는 타사 모듈이며 매우 강력합니다. 일반적인 ngRoute가 할 수있는 모든 기능과 많은 추가 기능을 지원합니다.

ngRoute를 통해 ui-router를 선택하는 일반적인 이유는 다음과 같습니다.

• ui-router는 중첩 된 뷰 와 여러 개의 명명 된 뷰를 허용합니다 . 다른 섹션에서 상속 된 페이지가있을 수있는 더 큰 앱에서 매우 유용합니다.

• ui-router를 사용하면 상태 이름을 기반으로 상태를 강력하게 연결할 수 있습니다. 한곳에서 URL을 변경하면 (으)로 링크를 작성할 때 모든 링크가 해당 상태로 업데이트됩니다 ui-sref. URL이 변경 될 수있는 대규모 프로젝트에 매우 유용합니다.

• 액세스하려는 URL을 기반으로 경로를 동적으로 생성하는 데 사용할 수있는 데코레이터 개념도 있습니다. 즉, 미리 모든 경로를 지정할 필요는 없습니다.

• 상태를 사용하면 여러 상태에 대한 다양한 정보를 매핑하고 액세스 할 수 있으며를 통해 상태간에 정보를 쉽게 전달할 수 있습니다 $stateParams.

• 를 통해 당신이 당신의 템플릿 내에서 UI 요소 (현재 상태의 탐색을 강조)을 조정하는 국가의 주 또는 부모에 있는지 쉽게 확인할 수 있습니다 $state당신이 그것을 설정을 통해 노출 될 수 있습니다 UI 라우터에 의해 제공 $rootScope에 run.

본질적으로 ui-router는 더 많은 기능을 가진 ngRouter이며 시트 아래에는 상당히 다릅니다. 이러한 추가 기능은 대규모 응용 프로그램에 매우 유용합니다.

추가 정보:

• Github : https://github.com/angular-ui/ui-router
• 선적 서류 비치:
  • API 참조 : http://angular-ui.github.io/ui-router/site/#/api
  • 가이드 : https://github.com/angular-ui/ui-router/wiki
• 자주 묻는 질문 : https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions
• 샘플 애플리케이션 : http://angular-ui.github.io/ui-router/sample/#/

ngRoute 는 AngularJS 코어의 초기 부분 인 AngularJS 팀이 개발 한 모듈입니다.

ui-router 는 라우팅 기능을 향상시키고 향상시키기 위해 AngularJS 프로젝트 외부에서 만들어진 프레임 워크입니다.

ui-router 문서에서 :

AngularUI 라우터는 인터페이스의 일부를 상태 머신으로 구성 할 수있는 AngularJS의 라우팅 프레임 워크입니다. URL 라우트를 중심으로 구성되는 Angular 코어의 $ route 서비스와 달리 UI-Router는 상태를 중심으로 구성되며 선택적으로 라우트 및 기타 동작이 첨부 될 수 있습니다.

상태는 명명 된, 중첩 및 병렬 뷰에 바인딩되므로 응용 프로그램 인터페이스를 강력하게 관리 할 수 ​​있습니다.

둘 중 어느 쪽이 더 낫지는 않으므로 프로젝트에 가장 적합한 것을 선택해야합니다.

그러나 응용 프로그램에서 복잡한 뷰를 계획하고 "$ state"개념을 처리하려는 경우. ui-router를 선택하는 것이 좋습니다.

ngRoute는 기본 시나리오에 적합한 앵귤러 코어 모듈입니다. 앞으로 출시 될 버전에서 더 강력한 기능을 추가 할 것이라고 생각합니다.

URL : https://docs.angularjs.org/api/ngRoute

Ui- 라우터는 ngRoute의 문제를 극복 한 기여 모듈입니다. 주로 중첩 / 복잡한 뷰.

URL : https://github.com/angular-ui/ui-router

ui-router와 ngRoute의 차이점 중 일부

http://www.amasik.com/angularjs-ngroute-vs-ui-router/

ngRoute는 핵심 AngularJS 프레임 워크의 일부입니다.

ui-router는 기본 라우팅 기능을 향상시키기 위해 만들어진 커뮤니티 라이브러리입니다.

다음은 ui-router 구성 / 설정에 대한 좋은 기사입니다.

http://www.ng-newsletter.com/posts/angular-ui-router.html

ngRoute 패러다임 내에 구현 된 중첩 뷰 기능을 사용하려면 각도 라우팅 세그먼트를 사용해보십시오. ngRoute를 교체하는 대신 확장하는 것을 목표로합니다.

일반적으로 ui-router는 상태 메커니즘에서 작동합니다. 간단한 예를 통해 이해할 수 있습니다.

..gaana 또는 saavan 또는 기타와 같은 음악 라이브러리를 많이 적용한다고 가정 해 봅시다. 페이지 하단에는 페이지의 모든 상태에서 공유되는 음악 플레이어가 있습니다.

이제 재생할 노래를 클릭한다고 가정 해 봅시다. 이 경우 전체 페이지를 다시로드하는 대신 해당 음악 플레이어 상태 만 변경해야합니다. ui-router로 쉽게 처리 할 수 ​​있습니다.

ngRoute에서 뷰와 컨트롤러를 연결하기 만하면됩니다.

각도 1.x

ng-route :

ng-route는 angularJS 팀에서 라우팅을 위해 개발했습니다.

ng-route : url (위치) 기반 라우팅.

전의:

$routeProvider
    .when("/home", {
        templateUrl : "home.html"
    })

ui-route :

ui-router는 타사 모듈에 의해 개발되었습니다.

ui-router : 상태 기반 라우팅

전의:

 $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'home.html'
        })

-> ui-router는 중첩 된 뷰를 허용합니다

ng-route보다 더 강력한 ui-router

ng-router , ui-router

ngRoute는 Angular 팀이 구축 한 모듈로 기본적인 클라이언트 측 라우팅 기능을 제공합니다. 이 모듈은 라우팅을위한 매우 강력한 기반을 제공하며이 블로그 게시물에 예시 된 것처럼 견고한 라우팅 기능을 제공하기 위해 매우 쉽게 구축 할 수 있습니다 (저자는 저자 인 Ward Bell과 Ben Nadel의 의견 추적을 읽으십시오). 몇 가지 각도 전문가)

ui-router는 URL 중심 경로에서 응용 프로그램 "상태"로 포커스를 이동합니다.이 상태는 URL에 반영되거나 반영되지 않을 수 있습니다.

ui-router가 추가 한 주요 기능은 중첩 된 상태와 명명 된 뷰입니다.

중첩 상태를 사용하면 다양한 응용 프로그램에 대한 컨트롤러 논리를 분리 할 수 ​​있습니다. 가장 간단한 예는 상단을 가로 지르는 기본 탐색, 왼쪽을 따라 보조 탐색 목록, 오른쪽에 콘텐츠가있는 앱입니다. 중첩 된 상태가 없으면 단일 컨트롤러는 일반적으로 컨텐츠뿐만 아니라 보조 탐색에 대한 디스플레이 로직을 처리해야합니다. 중첩 라우팅을 통해 이러한 문제를 분리 할 수 ​​있습니다.

명명 된 뷰는 UI 라우터의 또 다른 추가 기능입니다. ngRoute를 사용하면 페이지에 단일 ngView 지시문 만있을 수 있지만 ui-router의 명명 된 뷰를 사용하면 여러 ui-view 지시문을 지정할 수 있으며 각 상태는 이름 뷰의 템플릿 및 컨트롤러에 영향을 줄 수 있습니다. 이에 대한 간단한 예는 앱의 기본 콘텐츠를 기본보기로 설정 한 다음 별도의 ui-view 인 바닥 글 막대를 갖는 것입니다. 이 시나리오에서 바닥 글의 컨트롤러는 더 이상 상태 / 경로 변경 사항을 수신하지 않아도됩니다.

이 팟 캐스트 에피소드 에서 ngRoute와 ui-router를 잘 비교할 수 있습니다 .

상황을 더욱 혼란스럽게 만들기 위해 Angular 팀이 Angular 1.5 및 2.0 버전에서 출시 할 것으로 예상되는 새로운 "공식"라우팅 모듈을 주시하십시오. ngRoute 모듈이 교체됩니다. 다음 은 새로운 라우터 모듈에 대한 최신 문서입니다. 구현이 아직 완료되지 않았기 때문에이 게시물을 작성하는 시점에는 상당히 드문 편입니다. 시계 여기에 이 모듈이 실제로 출시되는시기에 대한 자세한 소식.

ngRoute는 모든 라우팅에 대해 하나의보기와 컨트롤러 만 지정할 수있는 기본 라우팅 라이브러리입니다.

ui-router를 사용하면 병렬 및 중첩 된 여러보기를 지정할 수 있습니다. 따라서 응용 프로그램에 복잡한 라우팅 / 뷰가 필요하거나 나중에 필요할 경우 ui-router로 이동하십시오.

이것은 AngularUI 라우터에 대한 시작 안내서입니다.

알아야 할 기본 사항 : ng-router 사용 $location.path()및 ui-router 사용$state.go

모든 기능을 우리에게 맡기십시오.

UI 라우터는 당신의 인생을 더 쉽게 만듭니다! 응용 프로그램에 주입하여 AngularJS 응용 프로그램에 추가 할 수 있습니다 ...

ng-route 핵심 AngularJS의 일부로 제공되므로 더 간단하고 옵션이 적습니다 ...

ng-route를 더 잘 이해하려면 여기를 참조하십시오 : https://docs.angularjs.org/api/ngRoute

또한 사용할 때 ngView를 잊지 마십시오.

ng-ui-router는 다르지만 다음과 같습니다.

https://github.com/angular-ui/ui-router 그러나 더 많은 옵션을 제공합니다 ....

AngularUI 라우터는 인터페이스의 일부를 상태 머신으로 구성 할 수있는 AngularJS의 라우팅 프레임 워크입니다. URL 라우트를 중심으로 구성된 Angular ngRoute 모듈의 $ route 서비스와 달리 UI-Router는 상태를 중심으로 구성되며 선택적으로 라우트 및 기타 동작이 첨부 될 수 있습니다.

https://github.com/angular-ui/ui-router

ngRoute는 Angular.js 팀이 개발 한 모듈로, 이전에는 Angular 코어의 일부였습니다.

ui-router는 라우팅 기능을 개선하고 향상시키기 위해 Angular.js 프로젝트 외부에서 만들어진 프레임 워크입니다.

1-ngRoute는 각도 팀에서 개발 한 반면 ui-router는 타사 모듈입니다. 2-ngRoute는 경로 URL을 기반으로 라우팅을 구현하고 ui-router는 응용 프로그램의 상태를 기반으로 라우팅을 구현합니다. 3-ui-router는 ng-route가 제공하는 모든 기능과 중첩 된 상태 및 여러 명명 된 뷰와 같은 추가 기능을 제공합니다.

ng-View(AngularJS 팀에서 개발)는 페이지 당 한 번만 사용할 수있는 반면 ui-View(타사 모듈)은 페이지 당 여러 번 사용할 수 있습니다.

ui-View 따라서 최선의 선택입니다.