Какой роутер для Angular1.5?

Этот вопрос кажется немного "IdidntwanttosearchonGoogle", но я сделал. Много и все работало.

Я пытаюсь создать небольшое веб-приложение с угловой версией 1.5. Проблема в том, что я никогда не использовал маршрут (НИКОГДА!), И Angular 1.5 кажется неоднозначным. Я видел, что 1.5 использует Component Router, такой как Angular 2, затем на странице Angular написано, что он устарел, и мы должны использовать ngRoute.

Дело в том, что в любом случае мне не удается понять, что взять и как его использовать. Попробовал это в моем bower.json:

{
  "name": "doit"
  "dependencies": {
  "angular": "1.5.8",
  "angular-component-router": "0.2.0"
  }
}

И в моем index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" integrity="sha384-MIwDKRSSImVFAZCVLtU0LMDdON6KVCrZHyVQQj6e8wIEJkW4tvwqXrbMIya1vriY"             crossorigin="anonymous">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>DoIt Application</title>
    <!-- SCRIPT DE CONNEXION -->
    <script src="bower_components/angular/angular.js"></script>
    <script src="bootstrap.js"></script>
    <script src="app/app.component.js"></script>
    <script src="bower_components/angular-component-router/angular_1_router.js"></script>
    <script src="bower_components/angular-component-router/ng_route_shim.js"></script>

</head>
<body ng-app="app">
    <my-app></my-app>

</body>
</html>

Если у вас есть руководство, которое правильно объясняет маршруты в Angular 1.5, кто работает, это было бы прекрасно!

Источник

3 ответа

Решение

Вы специально хотите использовать маршрутизатор Angular 1.5 или вы спрашиваете, какие библиотеки маршрутизаторов использовать?

Лично, если вы не строго используете Angular router, я бы порекомендовал использовать ui-router, так или иначе, он стал почти стандартом в угловых приложениях.

Что мне нравится в этом:

  1. Он в хорошем состоянии и очень стабильный.
  2. Простая в настройке и всеобъемлющая.
  3. Простые директивы, которые легко разрешают навигацию по тегам.
  4. Хорошее родительское пособие на ребенка (например, / Категории, / Категории / Футбол)
  5. Поддержка большого сообщества, так что вы найдете множество руководств и помощь легко.

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

Поместите это в свой bower.json:

{
  "angular-ui-router": "~0.3.1"
}

Поместите это в свое приложение:

angular.module('myApp', ['ui.router', ...other dependencies]);

РЕДАКТИРОВАТЬ:

Так что если вы хотите использовать компонент маршрутизации, вы можете подделать его в 0.3.

Однако, если вам нужна полная маршрутизация компонентов, тогда следует использовать 1.0 alpha.

Проверьте эту ссылку GitHub для получения дополнительной информации:

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

Источник

В идеальном угловом приложении 1.5 каждый маршрут связан с компонентом, который, в свою очередь, может регистрировать новые суб-маршруты. Более подробную информацию вы можете найти в новом Руководстве разработчика по компонентному маршрутизатору по https://docs.angularjs.org/guide/component-router

var portalModule = angular.module('portal', ['ngComponentRouter']);
portalModule.value('$routerRootComponent', 'portal');
portalModule.component('portal', {
  templateUrl: 'components/portal.html',
  $routeConfig: [
    { path: '/home', component: 'home', name: 'Home', useAsDefault: true },
    { path: '/apps/:name/:location*', component: 'app', name: 'Apps' },
  ],
});
Источник

Следуйте инструкциям для ui-router (который наиболее часто используется для маршрутизации в ng1)

Во второй части они объясняют, как выполнить маршрутизацию к компонентам.

Источник
Другие вопросы по тегам