zoukankan html css js c++ java

AngularJS Best Practices: pretty urls

By default, AngularJS will route URLs with a hashtag.

For example:

http://example.com/
http://example.com/#/users
http://example.com/#/roles

It is very easy to get clean URLs and remove the hashtag from the URL.

There are 2 things that need to be done.

Configuring $locationProvider
Setting our base for relative links

app.users.routes.js

(function() {
    'use strict';

    angular
        .module('app.users')
        .config(['$routeProvider', ', $locationProvider', function($routeProvider, $locationProvider) {
            $routeProvider.
                when('/users', {
                    templateUrl: '/app/components/users/views/user-list.tpl.html',
                    controller: 'UserController'
                });

            // Use the HTML5 History API
            $locationProvider.html5Mode(true);
        }]);

})();

What is the HTML5 History API? It is a standardized way to manipulate the browser history using a script. This lets Angular change the routing and URLs of our pages without refreshing the page. For more information on this, here is a good HTML5 History API Article. The $locationProvider will automatically fallback to the hashbang method for browsers that do not support the HTML5 History API.

To link around your application using relative links, you will need to set a <base> in the <head> of your document.

index.html

<!DOCTYPE html>
<html ng-app="app">
    <head>
        <title></title>
        <meta charset="utf-8" />
        <base href="/">
    </head>
    <body>
        <ul>
            <li>
                <a href="#/users">Users</a>
            </li>
            <li>
                <a href="#/roles">Roles</a>
            </li>
        </ul>

        <ng-view></ng-view>

        <script type="text/javascript" src="/assets/libs/angular/angular.min.js"></script>
        <script type="text/javascript" src="/assets/libs/angular/angular-route.min.js"></script>
        <script type="text/javascript" src="/app/app.js"></script>
        <script type="text/javascript" src="/app/components/users/app.users.js"></script>
        <script type="text/javascript" src="/app/components/users/app.users.routes.js"></script>
        <script type="text/javascript" src="/app/components/users/controllers/user.controller.js"></script>
        <script type="text/javascript" src="/app/components/roles/app.roles.js"></script>
        <script type="text/javascript" src="/app/components/roles/app.roles.routes.js"></script>
        <script type="text/javascript" src="/app/components/roles/controllers/role.controller.js"></script>
    </body>
</html>

查看全文

相关阅读:
instanceof 关键词
 类，类中成员变量，类中成员方法，方法中的局部变量，接口,接口中的方法的访问修饰符
 2.Object
1API简介
 CMC 实例管理
 BW 转换字符空格问题
 BW ON HANA 业务模型关系与数据取数
 进步缓慢
 BO客户端安装更新，重新启动挂起。
放弃看图，无差别筛选。

原文地址：https://www.cnblogs.com/zhangpengc/p/5011844.html